CSS Anfänger Probleme

darkkiller · #1 (**permalink**) 02.07.2007, 14:27

Hallo,
Ich versuche mich momentan mit einem CSS Design...
Folgender HTML Aufbau:

Code:

<html>
<head>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<div id="rahmen">
	<div id="header"></div>
	<div id="navi">Link :: Link :: Link :: Link</div>
	<div id="content">asd</div>
	
</div>

</html>

folgendes CSS-sheat

Code:

#header{
background-image:url("header.jpg");
width:600px;
height:140px;

}

#rahmen{
width:600px;
height:550px;
border-width:1px;
border-style:solid;
border-color:#000000;
margin: 0px auto;
margin-top:40px;
}

#navi{
float:left;
width:100%;
margin: 0px auto;

border-right-width:1px;
border-right-style:solid;
border-right-color:#000000;

border-bottom-width:1px;
border-bottom-style:solid;
border-bottom-color:#000000;

}

#content{
float:left;
width:100%;
margin: 0px;
text-align:left;
border-bottom-width:1px;
border-bottom-style:solid;
border-bottom-color:#000000;
}

#footer {
float:left;
width:100%;
text-align:center;
}



body{
background-color:#d5c479;
margin:0px;
padding:0px;
text-align:center;
font-family: Verdana;
font-size: 10px;
}

Soweitsogut...
Nun im Firefox ist dies kein problem wird alles schön angezeigt,
im IE7 jedoch rechnet er den 1px des Borders nicht hinzu und somit bleibt 1px freier streifen auf der rechten seite....sieht ziemlich unschön aus..

Nun zu meiner eigentlichen frage,... wie positioniere ich den footer immer am ENDE vom design ? und ziehe gleichzeitig mein "content" in die maximale länge ?

Danke für jedigliche hilfe

kadees · #2 (**permalink**) 02.07.2007, 15:04

Hallo,

Zitat:

wie positioniere ich den footer immer am ENDE vom design ? und ziehe gleichzeitig mein "content" in die maximale länge ?

Lies dir mal die FAQ hier durch (besonders Punkt 7) und/oder g**gle mal nach *Footer Stick Alt*.

Zitat:

im IE7 jedoch rechnet er den 1px des Borders nicht hinzu und somit bleibt 1px freier streifen auf der rechten seite....sieht ziemlich unschön aus.

Du gibst keinen Doctype an und schickts damit den IE (und nicht nur den) in den Quirks-Mode - wie die verschiedenen Browser dein Html rendern ist dann Glücksache.
Lies mal das hier: Websites mit dem richtigen Doctype versehen
und eine Übersicht findest du bei Heise: Wie Browser auf Doctypes reagieren

darkkiller · #3 (**permalink**) 02.07.2007, 15:49

So,... das gesamte nun umstrukturiert ..
nun habe ich den footer wo ich ihn auch haben will, doch nun ist mein gesamtes design links ausgerichtet und nicht mehr zentriert ?

Code:

#header{
background-image:url("header.jpg");
width:600px;
height:140px;
border-width:1px;
border-style:solid;
border-color:#000000;
margin: 0px auto;
margin-top:40px;

}


#navi{
float:center;
width:600px;
margin: 0px auto;
height:15px;

border-right-width:1px;
border-right-style:solid;
border-right-color:#000000;

border-left-width:1px;
border-left-style:solid;
border-left-color:#000000;

border-bottom-width:1px;
border-bottom-style:solid;
border-bottom-color:#000000;
}

#content{
float:center;
width:600px;
height:400px;
margin: 0px;
text-align:left;
border-right-width:1px;
border-right-style:solid;
border-right-color:#000000;

border-left-width:1px;
border-left-style:solid;
border-left-color:#000000;

border-bottom-width:1px;
border-bottom-style:solid;
border-bottom-color:#000000;
}

#footer {
float:center;
width:600px;
text-align:center;
}



html{
background-color:#d5c479;
margin:0px;
padding:0px;
font-family: Verdana;
font-size: 10px;

height: 100%;
width: 100%;
text-align:center;
}

kadees · #4 (**permalink**) 02.07.2007, 16:07

Kannste das ganze mal online stellen, wird dadurch leichter nachvollziehbar!
(http://xhtmlforum.de/40080-fuer-frag...twortende.html)

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
2 Probleme mit meinem CSS Design	leibnitz	CSS	15	08.05.2008 10:01
Probleme mit CSS	heiska	CSS	1	13.03.2008 12:49
CSS Probleme mit Imageflow	Toe	CSS	3	06.03.2008 11:59
CSS Layout: Probleme mit Mac IE und Safari	daedalus	CSS	16	13.06.2007 14:21
CSS Design Probleme	Hawklan	CSS	5	12.08.2004 11:45