...

View Full Version : Restaurant Menu Layout question



charissa
12-15-2010, 01:01 AM
Hi, I'm trying to use php to display several menu pages here:
http://www.dreamcateringla.com/menutest.php

What must I add to my code or style sheet to get the two columns to align at the top? Thanks if you have any advice, I'm a beginner.

optimus203
12-15-2010, 01:51 AM
You have multiple <body> and <head> tags, amongst others, which will invalidate your markup. Fix the errors in your code and hopefully that will fix:

Click Here to view your page errors (http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.dreamcateringla.com%2Fmenutest.php).

Excavator
12-15-2010, 05:06 AM
Hello charissa,
One column should be floated and the other margined over enough to make room for the floated one.
Your #menunav is not floated so #menulist cannot come up beside it.
Try making these changes highlighted in red to your CSS-



/*#container{width:780px; margin:0 auto;}*/
#topbar {
width:auto;
display:block;
height:80px;
}

#menunav {
/*display: block; */
width: 135px;
float: left;
padding-left: 20px;
}

#main {
width:auto;
display:block;
}

/*
div.spacer, solve an issue with #container height
in css 2 column layout.
*/

div.spacer {
clear:both;
height:10px;
display:block;
}

/* ------------------------------
PAGE ELEMENTS #NAVBAR
------------------------------ */
#menunav ul, #menunav ul li {
padding:0;
margin:0;
list-style:none;
/*float:left;*/
}

#menunav a {
color:#96454d;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serifbold;
font-weight: bold;
}

#menunav a:hover {
color: #a87a11;
}


#menunav li a:link, #menunav li a:visited {
text-decoration:none;
height: 14px;
line-height: 40px;
/*display: inline;
float: left;*/
width: auto;
padding:0px;
margin-top: 5px;
}

#menulist {
/*float: right;
top: 0px;
margin-left: 15px; */
margin: 0 0 0 145px;
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum