Kaimon: Accordion-balken verschwinden beim Browserfenster-verkleinern

Beitrag lesen

das ist die seite und hier der quellcode:

__________

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>FAK-Online - Schülerzeitung Gymnasium Pullach</title>

<script type="text/javascript" src="javascript/prototype.js"></script>
    <script type="text/javascript" src="javascript/effects.js"></script>
    <script type="text/javascript" src="javascript/accordion.js"></script>
    <script type="text/javascript">

Event.observe(window, 'load', loadAccordions, false);
        function loadAccordions() {
        var topAccordion = new accordion('horizontal_container', {
        classNames : {
        toggle : 'horizontal_accordion_toggle',
        toggleActive : 'horizontal_accordion_toggle_active',
        content : 'horizontal_accordion_content'
        },
        defaultSize : {
        width : 800
        },
        direction : 'horizontal'
        });

topAccordion.activate($$('#horizontal_container .horizontal_accordion_toggle')[0]);
            }
    </script>

<style type="text/css">

.horizontal_accordion_toggle {
                float: left;
                display: block;
                height: 420px;
                width: 30px;
                background: url(images/h_accordion_toggle.jpg) no-repeat top left #7f0000;
                color: #ffffff;
                text-decoration: none;
                outline: none;
                border-right: 1px solid #cde99f;
                cursor: pointer;
                margin: 0 0 0 0;
            }

.horizontal_accordion_toggle_active {
                background: url(images/h_accordion_toggle_active.jpg) no-repeat top left #c00000;
                border-right: 1px solid #f68263;
            }

.horizontal_accordion_content {
                height: 420px;
                float: left;

overflow: hidden;
                background-color: #ffffff;
                color: #444444;
            }

.horizontal_accordion_content p {
                    width: auto;
                    line-height: 150%;
                    padding: 5px 10px 15px 10px;
      overflow: auto;
                }

#horizontal_container {
 width: auto;
 height: 420px;
 overflow: hidden;
 margin-top: 1px;
 margin-right: auto;
 margin-bottom: 20px;
 margin-left: 0px;
        }

#banner {
 left: 0px;
 top: 0px;
 }
    body {
 background-color: #000000;
}
</style>
    <script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body>
<div id="horizontal_container" align="center">
  <h3 align="center" class="horizontal_accordion_toggle"><img width="30px" src="images/h_accordion_toggle1c.png" /></h3>
<div style="width: 645px; display: block; overflow: auto;" class="horizontal_accordion_content">
    <iframe src="News.html"; height="420px"; width="800px"></iframe>
  </div>
                <div align="center">

</div>
                <h3 align="center" class="horizontal_accordion_toggle"><img width="30px" src="images/h_accordion_toggle2c.png" /></h3>
<div style="width: 645px; display: block; overflow: auto;" class="horizontal_accordion_content">
                <iframe src="Artikel.html"; height="420px" width="800px"></iframe>
  </div>

[usw...]

<h3 align="center" class="horizontal_accordion_toggle"><img width="30px" src="images/h_accordion_toggle7c.png" /></h3>
<div style="width: 645px; display: none; overflow: auto;" class="horizontal_accordion_content">
                <iframe src="Redaktion.html"; height="420px"; width="800px"></iframe>
  </div>
</div>

</body>
</html>

____________