Menu not on the right place, help please

mjs · 06-23-2010, 01:00 PM

Thanks a lot and sorry for bothering.. I'm still a html/css code rookie and i need you help, please

and please have a look here

Regards,

Rowsdower! · 06-23-2010, 01:20 PM

Quote:

Originally Posted by mjs

Thanks a lot and sorry for bothering.. I'm still a html/css code rookie and i need you help, please

and please have a look here

Regards,

Add clear:left; to the style for "#leftpanel" and "#menuL_buttom" and those will slide under your menu as desired.

Also, you need to review your use of ID for these items. You have used the same ID more than once, which is not allowed. Some of your IDs should change to classes on this page.

mjs · 06-23-2010, 03:19 PM

Quote:

Originally Posted by Rowsdower!

Add clear:left; to the style for "#leftpanel" and "#menuL_buttom" and those will slide under your menu as desired.

OK, so many thanks for your attention, i very appreciated, and my problem fixed, but i'm sorry if i can understand your message :

Quote:

Originally Posted by Rowsdower!

Also, you need to review your use of ID for these items. You have used the same ID more than once, which is not allowed. Some of your IDs should change to classes on this page.

could you please give me an example?

and the css code inside look like:

Quote:

#leftpanel{float: left; width:199px; height:auto; background-image:url(back_left.png); background-repeat:repeat-y;}
#menuL_buttom{float:left; width:199px; height:58px; background-image:url(menuL_buttom.png);}

HTML code:

Quote:

Regards,

Rowsdower! · 06-23-2010, 04:09 PM

See the highlighted portions below for some of your cases of IDs being used more than once in a page:

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 name="author" content="DoHoZ Hosting (www.dohoz.com)" />
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	<title>DoHoZFoto Gallery |:| </title>
	<script src="includes/lightbox/lightbox.js" type="text/javascript"></script>
	<link href="includes/lightbox/lightbox.css" rel="stylesheet" type="text/css" />
	<link href="templates/images/style.css" rel="stylesheet" type="text/css" />

</head>

<body>
	<div id="page" align="center">
		<div id="content" style="width:800px">
			<div id="logo">

				<div align="left" class="address">
								</div>
			</div>

			<div id="topheader">
			<span class="titletext">My World, My Life, My Pride</span>
			</div>
			
			<div id="menuL">
			</div>
			<div id="menuR">
			</div>
			
			<div id="submenu">

				<div align="left" class="smallgraytext" style="padding:8px;">
					<a href="#">Home</a> | <a href="#">About Us</a> | <a href="#">Products</a> | <a href="#">Our Services</a> | <a href="#">Contact Us</a>				</div>

			</div>

			<div id="menuBorderL">
				<div class="smallwhitetext">
				Wednesday, 23 June 2010				</div>
			</div>
			<div id="">
			</div>
				
		<div id="contenttext">

			<div id="rightpanel">&nbsp;
			</div>
			<div class="bodytext" align="justify">
						<div id="homepage">
		<h3><font color="#FF6600">DoHoZ</font>Gallery</h3>

			<div class="center">
		<h3>Latest Photos Added<a href="#" onclick="javascript:popup_latestupdate();" title="Notes About Latest Added Photos"></a></h3><br />

			        	<div class="thumb_wrapper tile">
					<div class="title">Shot 3</div>
	        		<div class="container">
	            		<div class="shadow">&nbsp;</div>
						<div class="thumb"><a href="?dir=My+Shots&pic=Shot+3"><img src="data/thumbdata_TXkgU2hvdHNdfFtTaG90XzMuanBnXXxbMTI3Njc5MTU0MAjp.jpg" border="0"/></a></div>
					</div>
				</div>
					        	<div class="thumb_wrapper tile">

					<div class="title">Shot 1</div>
	        		<div class="container">
	            		<div class="shadow">&nbsp;</div>
						<div class="thumb"><a href="?dir=My+Shots&pic=Shot+1"><img src="data/thumbdata_TXkgU2hvdHNdfFtTaG90XzEuanBnXXxbMTI3Njc5MTU0MAjp.jpg" border="0"/></a></div>
					</div>
				</div>
					        	<div class="thumb_wrapper tile">
					<div class="title">Shot 4</div>

	        		<div class="container">
	            		<div class="shadow">&nbsp;</div>
						<div class="thumb"><a href="?dir=My+Shots&pic=Shot+4"><img src="data/thumbdata_TXkgU2hvdHNdfFtTaG90XzQuSlBHXXxbMTI3Njc5MTU0MAjp.jpg" border="0"/></a></div>
					</div>
				</div>
					        	<div class="thumb_wrapper tile">
					<div class="title">Shot 2</div>
	        		<div class="container">

	            		<div class="shadow">&nbsp;</div>
						<div class="thumb"><a href="?dir=My+Shots&pic=Shot+2"><img src="data/thumbdata_TXkgU2hvdHNdfFtTaG90XzIuanBnXXxbMTI3Njc5MTU0MAjp.jpg" border="0"/></a></div>
					</div>
				</div>
					</div>
	
	</div>
				</div>
			<div id="rightpanel">&nbsp;
			</div><br />

			<div id="">
			<span class="smallgraytext">
							</div>
			<div id="rightpanel">&nbsp;
			</div>
		</div>

			<div id="leftpanel">
				<div align="justify">

					<span class="smalltitle"><ul><li class="home_button"><a href="?">Home</a></li><li ><a href="?dir=Interior" title="Interior">Interior</a></li>        <li ><a href="?dir=My+Shots" title="My Shots">My Shots</a></li></ul></span>
				</div>
			</div>
			<div id="leftpanel">
				<div align="justify">
					<span class="smalltitle">&nbsp;</span>
				</div>

			</div>
			<div id="menuL_buttom">
				<div align="justify">
					<span class="smalltitle">&nbsp;</span>
				</div>
			</div>
			
			<div id="footer" class="smallgraytext">
			</div>
		</div>

	</div>

<!-- offsite thumbnail file creator -->
	<iframe id="thumbgen" name="thumbgen" style="width:0px; height:0px; border: 0px" src="thumb_generator.php?dir="></iframe>
	</body>
</html>

As you can see, you have used the IDs of "rightpanel" and "leftpanel" more than once each. There may be more IDs being duplicated, but these are the two that caught my eye.

Just run your code through the html validator and correct the errors that it shows you.