|
|||
Design - dynamische Breite?
Hallo,
das ist erst mein zweites Projekt (das erste ziemlich simpel), das ich per divs und CSS usw. umsetze. Doch jetzt habe ich ein Problem, hierum geht es: *** Ich habe einen Div "Koerper", in das die Divs "Head", "Content" und "Foot" kommen. Das Design (also "Koerper") hat eine fixe Breite, sagen wir 910px. Soweit kein Problem. Doch es soll außerdem möglich sein, dass, wenn im Contentbereich ein Bild von 1600x1200er Größe voll angezeigt wird, das komplette Design sich dieser Breite anpasst. "Head" und "Foot" sollen sich also dynamisch der Breite von "Koerper" anpassen (auch bei übergroßem Content). Das tut es allerdings nicht. Im FireFox (2.0.1 / 2.0.2) steht der zu breite Content einfach über und das Design rührt sich nicht. Im Internet Explorer 6 Geht nur "Koerper" mit und passt sich der Breite an, die "Head"-Div allerdings rührt sich nicht. Verdammt, woran liegt das? Hier mal der Code (Seite) Code:
<!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>GamingMedia.de</title> <link rel="stylesheet" type="text/css" href="style.css" /> <script type="text/javascript" language="javascript" src="main.js"></script> </head> <body> <div class="koerper"> <!-- HEAD START --> <div class="head"> <a href="index.html" target="_self"><img src="gr/lay/logo.jpg" id="logo" border="0" alt="GamingMedia.de" /></a> <div class="righttopnav"><img src="gr/lay/topnavstart.jpg" alt="" /><a href="#"><img src="gr/lay/topnav_6_1.jpg" border="0" alt="" /></a><a href="#"><img src="gr/lay/topnav_5_1.jpg" border="0" alt="" /></a><a href="#"><img src="gr/lay/topnav_7_1.jpg" border="0" alt="" /></a><a href="#"><img src="gr/lay/topnav_4_1.jpg" border="0" alt="" /></a><a href="#"><img src="gr/lay/topnav_3_1.jpg" border="0" alt="" /></a><a href="#"><img src="gr/lay/topnav_2_1.jpg" border="0" alt="" /></a><a href="#"><img src="gr/lay/topnav_1_1.jpg" border="0" alt="" /></a></div> <div class="subnav"> <a href="#" class="subnavchosen">News</a> | <a href="#" class="subnavclear">Reviews</a> | <a href="#" class="subnavclear">Previews</a> | <a href="#" class="subnavclear">Specials</a> | <a href="#" class="subnavclear">Trailer/Videos</a> | <a href="#" class="subnavclear">Galerien</a> </div> </div> <!-- HEAD END --> aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa </div> </body> </html> Code:
body { margin:0px; padding:0px; background-color: #585b52; } div.head { width:100%; background:url(gr/lay/head.jpg); height:116px; } #logo { float:left; position:relative; margin-left:10px; } div.righttopnav { position:relative; top:60px; float:right; } div.subnav { position:relative; top:61px; right:6px; float:right; padding-right:198px; font-family:trebuchet ms,verdana; font-size:11px; color:#3f3f3f; } div.koerper { margin-right:auto; margin-left:auto; width:906px; background:#ffffff; border-left:solid 1px #ffcd03; border-right:solid 1px #ffcd03; } Grüße Ricardo Geändert von RiChY (26.02.2007 um 23:23 Uhr) |
Sponsored Links |
|
|||
Hi,
das funktioniert leider nicht wirklich. Irgendwas verhindert im FF, dass "Koerper" von seinen festgelegten 906px Breite abrückt und breiter wird. Der IE macht das noch, aber der Kram darin dann... ich verzweifel noch an so einem eigtl. simplen Kram. Das sind Momente, da wünscht man sich die simple Tabellenstruktur |
|
|||
Ok,
habe es leider unsauber machen müssen, ging nicht anders. Neues Problem: Contentbereich... 3 Spalten, linker Contentteil, mittlerer Contentteil und rechts dann Werbung. Also 3 divs. Die linke float:left; die rechte float:right; und die mittlere gar kein float. Jetzt floatet allerdings der Content (verständlicherweise) aus der mittleren Spalte um die linke Spalte. Aber die Spalten müssen getrennte Bereiche sein. Bei einer Tabelle wäre es da einfach <td>content left</td><td>content middle</td><td>advert</td> Aber bei meiner CSS-"Lösung" funktioniert das nicht. Wie lässt sich das umsetzen? Diese Spalten sollen (bis auf die rechte, das ist aber eher nebensächlich) FIXE Breiten haben (wurde so entschieden). Wie vereine ich das? Ich habe da einfach versucht, den divs Breiten zuzuweisen, das Ergebnis sieht man unten. EDIT: Wie ich sehe, macht es der IE (Version 6) richtig, aber der FF (2.0.0.2) falsch. Hierum geht es... GamingMedia.de HILFE Geändert von RiChY (26.02.2007 um 23:42 Uhr) |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Problem mit dynamische Breite | Crys | CSS | 2 | 03.09.2009 13:44 |
2 Spalten - dynamische Breite | Zeussi | CSS | 1 | 20.08.2009 12:29 |
Dynamische Breite | amandine | CSS | 13 | 04.02.2008 16:12 |
Dynamische Layout Breite und Höhe | altes-kind | CSS | 7 | 12.01.2007 12:54 |
overflow problem: IE dynamische breite vs FF | anj | CSS | 9 | 12.10.2006 12:53 |