SELFHTML Forum
SELFHTML Forumsarchiv
2005
Juni
 |
SELFHTML Forumsarchiv |
 |
|
 |
|
Die folgende Nachricht zum Thema stammt von: Solo, 30. 06. 2005, 15:18
Hab da mal was in CSS gebastelt... hoffentlich läuft es auf allen Browsern.
Kann man das Layout unten so verwenden?!?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Layouttest</title>
<style type="text/css">
* { margin:0;padding:0;}
#header{
display:block;
background-color:#fcc;
}
#menu{background-color:#cff;float:left;
width:170px;
height:400px;
}
#main{display:block;}
#addon{
background-color:#fcf;
float:right;
width:170px;
height:400px;
}
#footer{
display:block;
background-color:#cfc;
clear:both;
}
#content{
padding:2px;
background-color:#f99;
margin-left:170px;
}
#torso{}
#topnav{
float:right;
background-color:#ccf;
}
#tabnav{
padding-left:170px;
background-color:#ffc;
}
#breadcrumbs{background-color:#0fc;}
</style>
</head>
<body>
<div id="torso">
<div id="header"><div id="topnav">Top-Navigation</div>this is<br /> the header
<div id="tabnav">Tab-Navigation</div>
</div>
<div id="menu">menu <br />menu <br />menu <br />menu <br />menu <br />menu <br />menu <br />menu <br />menu <br /></div>
<div id="main">
<div id="addon">Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon Addon </div>
<div id="breadcrumbs">breadcrumbs breadcrumbs breadcrumbs breadcrumbs </div>
<div id="content">main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main main </div>
</div>
<div id="footer">footer </div>
</div>
</body>
</html>
Die folgende Nachricht zum Thema stammt von: Cyx23, 30. 06. 2005, 15:50
Hallo,
»» ]... hoffentlich läuft es auf allen Browsern.
für Netscape 4 (4.8 beim Test) sieht es besser aus wenn die margin-Angabe
bei content per CSS-Weiche versteckt wird, z.B.:
#content{
padding:2px;
background-color:#f99;
}
* #content {margin-left:170px;}
Bei viel Text im Content geht es irgendwann unter Addon weiter,
stört aber vielleicht nicht, eher vielleicht die Höhen von 400px(?).
Grüsse
Cyx23
--
Goldschmiedekurse Workshops Schmuckgestaltung Trauringe selber machen
Barrierefreies Webdesign in Düsseldorf
Designleistungen
CSS für alle Browser
© 1998-2006 
Impressum, Software: Classic Forum
(CSS)