Willkommen Gast. Bitte anmelden oder registrieren.

Autor Thema: rechte und linke Seite wachsen nicht mit der Seitenmitte  (Gelesen 1630 mal)

0 Mitglieder und 1 Gast betrachten dieses Thema.

ZaHaDum1984

  • Bestätigter Nutzer
  • Beiträge: 4
Hallo Joomla-Fans,

ich habe ein Problem mit einem Template.

Die Bereiche für die rechte und linke Seite wachsen nicht mit dem Mittelteil der Seite.
Das führt zu einer sehr unschönen Unterbrechung in der Seiten-Optik.
Der angehängte Screenshot sollte das Problen zusätzlich verdeutlichen.

Was muss ich ändern, damit die beiden Seiten nach unten wachsen, falls der mittlere Bereich länger wird als die Module an den beiden Seiten?

Hier nun die benötigten Auszüge aus den Dateien index.php:
<link rel="stylesheet" type="text/css" href="<?php echo $this->baseurl?>/templates/<?php echo $this->template?>/css/template.css" />
<body>
<div id=container>
<div id="oben">
<div id="suche">
<jdoc:include type="modules" name="position-0" />
</div>

<div id="topmenu">
<jdoc:include type="modules" name="position-1" />
</div>

<div id="logo">
<h1>Magellan Shanty Chor Paderborn e.V.</h1>
</div>
</div>

<div id="mitte">
<div id="links">
<jdoc:include type="modules" name="position-7" style="xhtml"/>
</div>

<div id="beitraege">
<jdoc:include type="component" />
</div>

<div id="rechts">
<jdoc:include type="modules" name="position-6" style="xhtml" />
</div>
</div>

<div id="fusszeile">
<jdoc:include type="modules" name="position-14" />
</div>
</div>
</body>
...und template.css:
#container {
background-color: #ffffff;
width: 950px;
margin: 0 auto;
padding: 0px;
}

#oben {
width: 100%;
background-color: #7abcec;
padding-top: 2px;
}

#mitte {
width: 100%;
margin: 0;
background-color: #ffffff;
padding-top: 0px;
}

#fusszeile {
width: 100%;
margin: 0;
background-color:#7abcec;
clear: both;
}

#links {
width: 15em;
background-color: #c0c0c0;
background-image: url(../images/links.png);
background-repeat: repeat-y;
margin: 0;
float: left;
}

#beitraege{
width: 60%;
margin:0;
float: left;
background-color: #ffffff;
}

#rechts {
width: 15em;
background-color: #c0c0c0;
background-image: url(../images/rechts.png);
background-repeat: repeat-y;
margin: 0;
float: right;
}

Liebe Grüße

ZaHaDum1984

P.S.: Links kann ich ieder nicht liefern, da sich wieder alles in meiner lokalen Entwicklungsumgebung befindet.

Firstlady

  • Pink Berserk (Mod)
  • Beiträge: 190
    • www.chmst.de
Antw: rechte und linke Seite wachsen nicht mit der Seitenmitte
« Antwort #1 am: 11. März 2014, 08:08:50 »
Hallo,
dies wird oft gefragt. Eine Möglichkeit sind "faux columns".
Eine andere Möglichkeit: Gib allen Eltern-Elementen diener Spalten (und denen natürlich auch) explizit height: 100%.
also html, body, container, mitte - die ganze Kaskade.

Grüße, Christiane