Fabienne: Frage zum Style

Beitrag lesen

Hi Cheatah!

Wie hoch ist das Element?

Der CONTAINER umfasst den kompletten Content. Ist zwar keine Höhe definiert, aber ca. 500px Content befindet sich drin.

Hier mal der ganze Code dazu:
Vielleicht gibts ja noch andere Dinge, die falsch sind....

  
  
<!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>  
<title></title>  
<meta name="keywords" content=" ">  
<meta name="description" content=" ">  
  
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />  
  
<link rel="stylesheet" type="text/css" href="styles.css">  
</head>  
  
<body>  
	<div id="center">  
		<div id="CONTAINER">  
		  
		 	<div id="DIV_LOGO"><a href="/"><img src="bilder/pix.gif" alt="zur&uuml;ck zur Startseite" name="logo" width="440" height="50" border="0" /></a></div>  
			<div id="DIV_NAV1">  
				<div id="NAV1">  
					<ul>  
						<li><a href="?kat=20"  class="horizontal_menu_inactive_1">Startseite</a></li>  
						<li><a href="?kat=23"  class="horizontal_menu_active_1">Zur&nbsp;Person</a></li>  
					</ul>						  
				</div>						  
			</div>  
			<div id="DIV_IMAGE"><img src="bilder/layout/banner_1.jpg" width="940" height="360" /></div>  
			<div id="DIV_CONTENT">  
			  
      			<div id="DIV_470">			  
      			      	<div id="DIV_NAV2">  
      					<div id="NAV2">  
      						<ul>  
      				      			<li><a href="?kat=51"  class="horizontal_menu_inactive_2">Vita</a></li>  
      							<li><a href="?kat=52"  class="horizontal_menu_inactive_2">Privat</a></li>  
          						</ul>						  
      		    			</div>	  
      			        </div>	  
             			</div>  
  
      			  
      			<div id="DIV_470">  
      				<div id="DIV_TEXT">  
                    <h1>Headline</h1>  
                    <p>Lorem ipsum dpretium et Nam massa id at vitae.  
                    Vel dui elit Nulla magna quis Quisque augue pede pretium Suspendisse.  
                    Eget lacinia Integer nibh vestibulum pharetra libero Morbi vitae tempor.</p>  
        			</div>  
      			</div>  
			  
      			<div id="DIV_FOOTER">HIER der Footer</div>  
      			<div id="BOX_end"></div>  
	  		  
 		 </div>  
	</div>  
</div>  
</body>  
</html>  
  
  
  

  
  
@charset "iso-8859-1";  
/* STANDARD */  
  
  
html             	  { height: 100%; min-height: 100%;}  
body 		     	  {	height: 101%; margin: 0; background:url(bilder/layout/bg_center.jpg) repeat-x; color: #666666;  
                  FONT-SIZE: 12px; line-height: 17px; FONT-FAMILY: "Times New Roman", Times, serif, Arial; }  
						  
#center 		      {	text-align: center; width: 99%; padding: 0px 0px 0px 0px; }  
#CONTAINER 	      { text-align: left; margin: 0 auto; width: 960px; padding: 0px 10px 0px 10px; background:url(bilder/layout/bg_container.gif) no-repeat top center;  
						margin-top: 0px; margin-bottom: 0px; }  
#BOX_end			  { clear: both; }	  
  
#DIV_LOGO         	  { width: 960px; float: left; padding: 35px 0px 35px 0px; text-align: center; } /* left, center, right*/  
#DIV_NAV1         	  { width: 960px; float: left; padding: 0px 0px 0px 0px; }  
#DIV_NAV2         	  { width: 210px; float: left; padding: 0px 0px 0px 0px; margin: 0px 30px 0px 10px; }  
#DIV_NAV3         	  { width: 200px; float: left; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; }  
  
#DIV_IMAGE       	  { width: 940px; float:left; padding: 10px 10px 30px 10px; background:url(bilder/layout/bg_image.jpg) bottom no-repeat;}  
#DIV_CONTENT       	  { width: 940px; float:left; padding: 10px 10px 30px 10px; text-align:left;}  
#DIV_470        	  { width: 470px; float:left; padding: 0px 0px 0px 0px;}  
#DIV_TEXT        	  { width: 450px; float:left; padding: 0px 20px 0px 0px; text-align: justify; FONT-FAMILY: Arial, "Times New Roman", Times, serif ;}  
  
#DIV_FOOTER        	  { width: 920px; float:left; padding: 10px 20px 10px 20px; margin-top: 20px; margin-bottom: 50px;  
						border-top: 1px dotted #999999; color: #999999; FONT-FAMILY: Arial, "Times New Roman", Times, serif; }  
#DIV_FOOTER a:link    { font-weight: bold; color: #3D88C2; text-decoration: none; }  
#DIV_FOOTER a:visited { font-weight: bold; color: #3D88C2; text-decoration: none; }  
#DIV_FOOTER a:hover   { font-weight: bold; color: #3D88C2; text-decoration: none; }  
#DIV_FOOTER a:active  { font-weight: bold; color: #3D88C2; text-decoration: none; }  
  
  
/*---------------------------------------------------------------------------------------------------------------------------*/  
  
#DIV_TEXT ul 		  { margin: 0px 0px 0px 15px; padding: 0px 0px 0px 10px;}  
#DIV_TEXT li 		  { margin: 0px 0px 0px 0px;  padding: 8px 0px 3px 0px; list-style-type: square; }						  
  
/*---- LINKS ----------------------------------------------------------------------------------------------------------------*/  
  
a:link   	          { font-weight: normal; color: #3D88C2; text-decoration: none; }  
a:visited 	          { font-weight: normal; color: #3D88C2; text-decoration: none; }  
a:hover   	          { font-weight: normal; color: #666666; text-decoration: none; }  
a:active    	      { font-weight: normal; color: #666666; text-decoration: none; }  
  
h1  	 			  { color: #007BA8; font-size: 24px; font-weight: normal; margin: 0px 0px 20px 0px; line-height: 28px;text-align: left; FONT-FAMILY: "Times New Roman", Times, serif, Arial;}  
  
/*---- NAV 11111111 ------------------------------------------*/  
  
  
#NAV1 				{ line-height: 40px; }  
  
#NAV1 ul 			{ width: 960px; font-size: 16px; font-weight: normal; text-align: center;  
					  list-style-type: none; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; } /* text-transform: uppercase; */  
					  
#NAV1 li 			{ display: inline; } /* clear: left;  ODER  display: inline; *//* UL-WIDTH entscheidet */  
#NAV1 li a 			{ float: left; padding: 0px 19px 0px 18px;  
					  background:url(bilder/layout/nav1_trenn.gif) no-repeat right; color: #FFFFFF; text-decoration: none; }  
#NAV1 li a:hover 	{ background:url(bilder/layout/nav1_a.jpg) no-repeat right; color: #007BA8; text-decoration: none; }  
#NAV1 li a.horizontal_menu_semiactive_1 		{ background:url(bilder/layout/nav1_a.jpg) no-repeat right; color: #007BA8; text-decoration: none; }	  
#NAV1 li a.horizontal_menu_semiactive_1:hover { background:url(bilder/layout/nav1_a.jpg) no-repeat right; color: #007BA8; text-decoration: none; }  
#NAV1 li a.horizontal_menu_active_1 		{ background:url(bilder/layout/nav1_a.jpg) no-repeat right; color: #007BA8; text-decoration: none; }	  
#NAV1 li a.horizontal_menu_active_1:hover { background:url(bilder/layout/nav1_a.jpg) no-repeat right; color: #007BA8; text-decoration: none; }  
  
/*---- NAV 22222222 ------------------------------------------*/  
  
  
#NAV2 				{ float: left; background: white; line-height: 16px; margin-bottom: 10px;}  
  
#NAV2 ul 			{ width: 210px; font-size: 15px; font-weight: bold;  
					  background: white; list-style-type: none; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; }  
					  /* text-transform: uppercase; */  
					  
#NAV2 li 			{ clear: left; } /* clear: left;  ODER  display: inline; *//* UL-WIDTH entscheidet */  
#NAV2 li a 			{ float: left; padding: 7px 0px 7px 10px; width: 200px; border-bottom: 1px solid #EEEEEE;  
					  background:url(bilder/layout/bg_nav2_p.jpg); color: #666666; text-decoration: none; }  
#NAV2 li a:hover 	{ background:url(bilder/layout/bg_nav2_a.jpg); color: #007BA8; text-decoration: none; padding: 7px 0px 7px 25px; width: 185px; }  
#NAV2 li a.horizontal_menu_semiactive_2 		{ background:url(bilder/layout/bg_nav2_a.jpg); color: #007BA8; text-decoration: none; padding: 7px 0px 7px 25px; width: 185px; }	  
#NAV2 li a.horizontal_menu_semiactive_2:hover { background:url(bilder/layout/bg_nav2_a.jpg); color: #007BA8; text-decoration: none; padding: 7px 0px 7px 25px; width: 185px; }  
#NAV2 li a.horizontal_menu_active_2 		{ background:url(bilder/layout/bg_nav2_a.jpg); color: #007BA8; text-decoration: none; padding: 7px 0px 7px 25px; width: 185px; }	  
#NAV2 li a.horizontal_menu_active_2:hover { background:url(bilder/layout/bg_nav2_a.jpg); color: #007BA8; text-decoration: none; padding: 7px 0px 7px 25px; width: 185px; }  
  
  
/*---- NAV 33333333333 ------------------------------------------*/  
  
  
#NAV3 				{ float: left; line-height: 12px; margin-bottom: 10px;}  
  
#NAV3 ul 			{ width: 190px; font-size: 13px; font-weight: bold;  
					   list-style-type: none; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; }  
					  /* text-transform: uppercase; */  
					  
#NAV3 li 			{ clear: left; } /* clear: left;  ODER  display: inline; *//* UL-WIDTH entscheidet */  
#NAV3 li a 			{ float: left; padding: 4px 0px 4px 15px; width: 175px;  
					  background:url(bilder/layout/bg_nav3_p.jpg) left center no-repeat; color: #666666; text-decoration: none; }  
#NAV3 li a:hover 	{ background:url(bilder/layout/bg_nav3_a.jpg) left center no-repeat; color: #007BA8; text-decoration: none; }  
#NAV3 li a.horizontal_menu_semiactive_3 		{ background:url(bilder/layout/bg_nav3_a.jpg) left center no-repeat; color: #007BA8; text-decoration: none; }	  
#NAV3 li a.horizontal_menu_semiactive_3:hover { background:url(bilder/layout/bg_nav3_a.jpg) left center no-repeat; color: #007BA8; text-decoration: none; }  
#NAV3 li a.horizontal_menu_active_3 		{ background:url(bilder/layout/bg_nav3_a.jpg) left center no-repeat; color: #007BA8; text-decoration: none; }	  
#NAV3 li a.horizontal_menu_active_3:hover { background:url(bilder/layout/bg_nav3_a.jpg) left center no-repeat; color: #007BA8; text-decoration: none; }  
  
/*------------------------------------------------------------*/  
  

Besten Dank für Eure Unterstützung!
Fabienne