helg: css eigenschaft width 100%

Beitrag lesen

SELF-Forum

css eigenschaft width 100%

helg
– Informationen zu den Bewertungsregeln

Grüße,
oder floats um margins ergänzen, wenn ich dich richtig verstanden habe (skizze wäre noch besser)
MFG
bleicher

Ah das hat mich jetzt auf die Idee gebracht.

Ich habe #header "position:relative;" und ein "padding-left:310px;"(- die Breite des bildes) verpasst.

Dann habe ich #logo mit "position:absolute; top:0; left:0;" absolut positioniert.

Jetzt wird die liste relativ in der Breite auf gebaut.

Hier der Code:

  
  
<!DOCTYPE HTML>  
<html>  
<head>  
<meta charset="UTF-8">  
<title>navigation02</title>  
<link rel="stylesheet" type="text/css" href="navigation05.css" media="screen" />  
</head>  
<body>  
  
<div id="wrapper">  
  
<div id="header">  
<div id="logo">logo</div>  
<ul id="navigation">  
<li><a href="#1">link 1</a></li>  
<li><a href="#2">link 2</a></li>  
<li><a href="#3">link 3</a></li>  
<li><a href="#4">link 4</a></li>  
<li><a href="#5">link 5</a></li>  
</ul>  
</div>  
  
</div>  
  
  
</body>  
</html>  
  


  
@charset "UTF-8";  
/* CSS Document */  
  
body, ul, li {  
	margin:0;  
	padding:0;  
	font-family:Arial, Helvetica, sans-serif;  
	font-size:0.85em;  
	}  
  
ol, ul, dl {  
	list-style-type:none;  
	}  
  
#wrapper{  
	background-color:#399;  
	margin:0;  
	padding:10px 30px;  
	}  
  
#header {  
	position:relative;  
	background-color:#00cc00;  
	height:75px;  
	border:0px solid #000;  
	margin:0 auto;  
	padding-left:310px;  
	padding-right:10px;  
	}  
	  
#logo {  
	position:absolute;  
	top:0;  
	left:0;  
	width:300px;  
	height:75px;  
	background-color:#006;  
	color:#FFF;  
	float:left;  
	}  
  
#navigation li {  
	position:relative;  
	float:left;  
	width:20%;  
	}  
  
#navigation li a {  
	display:block;  
	text-align:center;  
	border:0px solid #000000;  
	padding-top:10px;  
	padding-bottom:10px;  
	background-color:#666666;  
	color:#FFFFFF;  
	margin-right:0px;  
	}
Beitrag melden
–
Informationen zu den Bewertungsregeln