Hi,
ich arbeite mich gerade in das CSS Templating ein, mit div-tags anstatt Tabellen zu benutzen.
Nachdem ich gestern verstanden habe was es mit dem Box Hack auf sich hat und das auch umsetzen konnte, hänge ich jetzt an einer blöden Sache, zu der ich keine Idee habe, wie ich das lösen muss.
Ich habe folgenden Code in der index.php
PHP Code:
<?php if (mosCountModules( "right" )) { ?>
<div id="rightContent">
<?php mosLoadModules ( 'right' ); ?> <br />
<?php mosLoadModules ( 'user2' ); ?>
</div>
<?php } ?>
Es geht ja darum, wenn die rechte Spalte leer ist, soll das div nicht angezeigt werden, ähnlich wie das bei der Tabellenspalte vorher war.
Allerdings wird im CSS ja für die Breite der Divs feste (bei mir prozentuale) Werte angegeben wie hier:
Quote:
#rightContent {
background-color: Navy;
color: White;
float: right;
margin: 0px;
padding: 0px;
position: relative;
vertical-align: top;
width: 21%; /* Box Model Hack*/
voice-family: "\"}\"";
voice-family: inherit;
}
html>body #rightContent {
width: 20%;
}
|
Wenn in der rechten Spalte jetzt kein Modul geladen wird, sollte sich der Main Content ja ausbreiten, macht er aber nicht, da das CSS ja vorgibt wie breit der sein muss
Hat jemand eine Idee wie man das venünftig umsetzen kann? Bin für fast jeden Vorschlag offen.
NACHTRAG:
Ich habe mittlerweile eine etwas eigensinnige Lösung gefunden, die funktioniert. Es ist die einzige Idee die ich hatte um das Problem zu lösen:
PHP Code:
<?php if (mosCountModules( "left") and mosCountModules("right")) { ?>
<div id="leftContent">
<?php mosLoadModules ( 'left' ); ?> <br />
<?php mosLoadModules ( 'user1' ); ?>
</div>
<div id="mainContent">
<?php mosLoadModules ( 'top' ); ?>
<?php include_once("mainbody.php"); ?>
<?php mosLoadModules ( 'bottom' ); ?>
</div>
<div id="rightContent">
<?php mosLoadModules ( 'right' ); ?> <br />
<?php mosLoadModules ( 'user2' ); ?>
</div>
<? } elseif (mosCountModules("left")) { ?>
<div id="leftContent">
<?php mosLoadModules ( 'left' ); ?> <br />
<?php mosLoadModules ( 'user1' ); ?>
</div>
<div id="mainContentWide">
<?php mosLoadModules ( 'top' ); ?>
<?php include_once("mainbody.php"); ?>
<?php mosLoadModules ( 'bottom' ); ?>
</div>
<? } elseif (mosCountModules("right")) { ?>
<div id="mainContentWide">
<?php mosLoadModules ( 'top' ); ?>
<?php include_once("mainbody.php"); ?>
<?php mosLoadModules ( 'bottom' ); ?>
</div>
<div id="rightContent">
<?php mosLoadModules ( 'right' ); ?> <br />
<?php mosLoadModules ( 'user2' ); ?>
</div>
<?php } ?>
Wie ihr seht ich Frage einfach ab, in welchem Bereich Module geladen sind und lade dementsprechend die Inhalte rein, mit dem Unterschied, wenn im Left und Right Bereich Module sind, dann bekommt der MainContent die ID=MainContentWide ansonsten die ID=MainContent.
Im CSS gebe ich dem MainContentWide dann 80% breite und dem MainContent 60% Breite.
Wenn jemand nen besseren Ansatz hat, das zu lösen wäre ich sehr erfreut, ich halte das nämlich für ganz schön aufwendig.
Gruss
musicones