Die div Kontainer spinnen, oder ich

quantification

Also ich möchte die Seite in zwei "Modi" betreiben. Einmal mit der Referenzbox und einmal ohne die Referenzbox, also auf einigen Unterseiten soll diese erscheinen und auf anderen nicht.

CSS

*.spalte { text-align:justify; }  
*.spalte#links {padding-left: 40px; width: 260px; margin-right: 20px;float:left !important; } 
*.spalte#rechts {padding-left: 40px; padding-right: 40px;width: auto;}

HTML

<div class="spalte" id="links">    // Referenzen und die Referenzen werden über php include eingebunden //    <h3>REFERENZEN<h3>    ... dann die Referenzen ...</div><div class="spalte" id="rechts">     Lorem ipsum ...</div><div style="clear:both"></div>

Durch die Seitenstruktur bleibt mir nur die Möglichkeit, dass ich wenn ich die Referenzen nicht angezeigt haben will, den Inhalt des div.spalte#links einfach leer zu lassen.

Also das ganze sieht dann so aus

HTML

<div class="spalte" id="links"></div>

So sehen die Ergebnisse aus:

Für den Fall, dass die Referenzbox gefüllt ist soll der (im Moment noch) Lorem Ipsum Text gerade runterlaufen und nicht den Kontainer umfließen.

Danke!

djheke

Code

#links {
 width:260px;
 float:left;
}


#rechts {
 margin-left:260px;
}

Für diese Spalten kein margin und padding verwenden.

Nur die Elemente wie bsw. li , h1 , p u.s.w. oder #links_innen und #rechts_innen

quantification

aber wenn im linken Kontainer nichts steht soll der ja die breite 0 haben!!!!

quantification

Links gefüllt

HTML

<div class="spalte" id="links">
    <div class="custom"  >
        <h3>Referenzen</h3>
        <p id="brdr_ref">
            <img src="/images/portfolio/abc.png" border="0" alt="abc" title="abc" />
            <img src="/images/portfolio/def.png" border="0" alt="def" title="def" />
            <img src="/images/portfolio/ghi.png" border="0" alt="ghi" title="ghi" />
            <img src="/images/portfolio/jkl.png" border="0" alt="jkl" title="jkl" />
        </p>
    </div>
</div>


<div class="spalte" id="rechts">
    <h2>Herzlich Willkommen</h2>
    <p>
        Lorem ipsum dolor sit amet ... sea takimata sanctus est Lorem ipsum dolor sit amet.
    </p>
</div>


<div style="clear:both"></div>

Alles anzeigen

Links leer

HTML

<div class="spalte" id="links">
</div>


<div class="spalte" id="rechts">
    <h2>Herzlich Willkommen</h2>
    <p>
        Lorem ipsum dolor sit amet ... sea takimata sanctus est Lorem ipsum dolor sit amet.
    </p>
</div>


<div style="clear:both"></div>

Alles anzeigen

djheke

Achso, dann guck mal hier.
http://www.gipspferd.de/forumhilfe/display-table/

quantification

D a n k e

Tags