PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Hintergrund wird in FF nicht angezeigt

Blade II
2007-05-26, 19:26:41
Hi

Sitze grad an der Umsetzung eines Designs.
Das Design ist valid XHTML 1.0 und auch valid CSS.

Es ist wie folgt aufgebaut:
Logo
Navi ------ Content

Der gesamte Inhalt wird von einem div-Element umrahmt, welches auch die CSS Attribute für die Hintergrundfarbe beinhaltet.

Das Problem scheint jetzt nur zu sein, dass ich den Inhalt mehrmals in div-Elemente verschachtelt habe:

<body>
<div id="main"> <!-- Box um gesamten Inhalt -->
<div class="box2">
<div class="box3>
Etwas Inhalt
</div><!-- End box3 -->
</div><!-- End box2 -->
</div><!-- End main -->
</body>


Wie schaffe ich es nun, dass auch Firefox den Hintergrund bis zum Seitenende zieht?

Zur besseren Veranschaulichung, das Design:
als Online Version (http://demon-coding.userhost.de/referenzen/tanzgruppe_nieheim/index.html)
Stylesheet (http://demon-coding.userhost.de/referenzen/tanzgruppe_nieheim/style.css)
zum Download (http://demon-coding.userhost.de/referenzen/tanzgruppe_nieheim/download.zip)

Greets
Blade II

Edit:// Fehler gefunden: Rechte Spalte darf nicht geflotet werden
darph
2007-05-26, 22:30:52
Zwar OT und ja, Herr Yond, meine Meinung (und die des w3c), aber: Mach's doch in strict - dein Code würde es jedenfalls hergeben (bis auf das Logo - die Größenangaben müßten ins CSS, besser noch, das Bild als Hintergrundbild einbinden). :)


Es ist aber, wenn du meinen Senf gestattest, keine allzugute Idee, den Spalten eine fixe Breite zugeben.
http://img100.imageshack.us/img100/8682/clipboardimagecx4.th.png (http://img100.imageshack.us/img100/8682/clipboardimagecx4.png)
DanMan
2007-05-27, 01:09:39
Es ist aber, wenn du meinen Senf gestattest, keine allzugute Idee, den Spalten eine fixe Breite zugeben.
http://img100.imageshack.us/img100/8682/clipboardimagecx4.th.png (http://img100.imageshack.us/img100/8682/clipboardimagecx4.png)
Naja, durch die Bilder hinter den Überschriften wird ihm nicht viel mehr übrig bleiben. Ich würde aber die gesamte Seite noch min. 100px breiter machen. So 800px sollten eigentlich mittlerweile immer drin sein.

P.S.: Idiotenversammlung? :D
Blade II
2007-05-27, 15:33:56
Ja, die Breite ist wirklich nicht die Beste. Hab die Templatevorlage aber leider so bekommen.
darph
2007-05-27, 15:51:47
<div id="right-column">
<div class="edge topleft"></div>
<div class="edge topright"></div>
<div class="cap-content">Home</div>

<div id="content">
<div style="border: 1px solid #505050; padding: 5px;">
<p>Lorem Ipsum...</p>
</div>

.cap-content {
background-image: url("images/top.gif");
height: 20px;
line-height: 20px;
margin-top: 10px;
text-align: center;
color: #FFFFFF;
font-size: 8pt;
font-weight: bold;
}

.edge {
width: 18px;
height: 18px;
border: 0px solid green;
}

.topleft {
float: left;
background-image: url("images/topleft.gif");
}

.topright {
float: right;
background-image: url("images/topright.gif");
}

Wenn du jetzt hingehst, und die Breite nicht in Pixeln, sondern in pt angibst, dann skaliert die Breite des Textfeldes zusammen mit der Textgröße, während der Rahmen immer paßt.

http://img502.imageshack.us/img502/4801/toplefttc5.gif (https://addons.mozilla.org/firefox/1174) http://img502.imageshack.us/img502/2641/topuw0.gif (https://addons.mozilla.org/firefox/1174) http://img502.imageshack.us/img502/3959/toprightpw3.gif (https://addons.mozilla.org/firefox/1174)


Und beachte die Anführungszeichen im CSS. ;)