sizewrap

[easyweb]

Need help with a menu,
Currently it displays across the entire page ( width )

I have tried a few things that did not work, and I think it is due to css code of "sizewrap"

Wondering if I am correct, and If I can add something to size it up:

<div id="menu">
<div id="sizewrap">

<ul>
<li class="first"><a href="index.php">Home</a></li>
<li><a href="about.php">About Us</a></li>
<li><a href="services.php">Services</a></li>
<li><a href="submit.php">Submit Your Script</a></li>
<li><a href="advertise.php">Advertise</a></li>
<li class="last"><a href="contact.php">Contact Us</a></li></ul>

</div><!--end wrapper -->
</div><!--end menu -->
<div style="clear:both"></div>

Thank you in advance.

[mlegg]

Where is the CSS info?

[easyweb]

Where is the CSS info?

/* MASTER RESET``````````````````````````````````````````````````````````````````````````````*/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0px; padding:0px;}
body{ margin:0px; padding:0px; position:relative;}
ul{margin:0;padding:0;}
ul li{margin:0;padding:0;list-style:none;}
ol{margin:0;padding:0;}
ol li{margin:0;padding:0;list-style:none;}
img { border:0px; }
a.image:link, a.image:visited, a.image:hover {background: none;	padding: 0; text-decoration:none;}
a.image img {border: none;}
a:link, a:visited{text-decoration:none; color:#036;}
a:hover {text-decoration:underline;}

body {
	font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#555555;
	line-height:160%;
	background:#184671 url(images/body-bg.png) top center repeat-x;
	text-align:center;
}

#sizewrap{margin:0 auto; text-align:left; width:990px; overflow:hidden;}

/* HEADER```````````````````````````````````````````````````````````````````````````````*/

#header {}
#header .logo {width:368px; height:110px; background:url(images/logo.png); display:block; float:left;}
#header .search{width:622px; height:110px; display:block; background:url(images/search.png); float:left;}
#header .intro{width:260px; height:25px; display:block; margin:42px 0 0 30px; line-height:25px; text-align:right; float:left;}
#header .search-box{width:165px; height:34px; float:left; margin:37px 10px 0 21px; }
#header .in{padding:0; margin:0; border:none; line-height:34px; width:165px; height:34px; background:none; color:#999; font-size:11px;}
#header .search-button{width:113px; height:34px; float:left; background:url(images/search-button.png); display:block; margin:37px 0 0 0;}
#header .bt{width:113px; height:34px; margin:0; padding:0; border:none; background:none;}


#menu{height:50px; margin:5px 0 1px 0;}
#menu ul{margin:0; padding:0; list-style:none; height:50px}
#menu ul li{padding:0 40px; border-right:1px solid #1c3d61; border-left:1px solid #446488; line-height:50px; float:left;}
#menu ul li.first{padding:0 40px; border-right:1px solid #1c3d61; border-left:0px solid #446488; line-height:50px; float:left;}
#menu ul li.last{padding:0 40px; border-right:0px solid #1c3d61; border-left:1px solid #446488; line-height:50px; float:left;}
#menu a:link, #menu a:visited{color:#fff; font-size:14px; font-weight:bold;}



#main{}
#main p, #main pre{margin:0 0 10px 0;}
#main .top{width:990px; height:14px; background:url(images/main-top.png); display:block;}
#main .bottom{width:990px; height:14px; background:url(images/main-bottom.png); display:block;}
#main .content{width:950px; background:url(images/main-bg.png) repeat-y; padding:10px 20px; display:block; overflow:hidden;}


#main h1{font-family:Arial, Helvetica, sans-serif; font-size:17px; color:#111; display:block; margin:0 0 10px 0; text-transform:uppercase;
border-bottom:1px dotted #ccc; padding:0 0 5px 0; font-weight:bold;}
#main h2{font-family:Tahoma, Helvetica, sans-serif; font-size:14px; color:#111; display:block; margin:0 0 5px 0; font-weight:bold;}



#main .onetop{width:950px; height:10px; background:url(images/1by1-top.png); display:block;}
#main .onebottom{width:950px; height:10px; background:url(images/1by1-bottom.png); display:block; margin:0 0 20px 0;}
#main .onecon{width:930px; background:url(images/1by1-bg.png) repeat-y; overflow:hidden; padding:10px;}

#main .onecon ul{ margin:0; padding:0; list-style:none;float:left}
#main .onecon li{width:165px; height:16px; line-height:16px; background:url(images/box.png) left no-repeat; padding:0 0 0 20px; margin:0 0 5px 0;display:block;} 
#main .onecon li a:link, #main .onecon li a:visited{ font-weight:bold;}



#main .frame{width:650px; float:left;}
#main .twobythree{width:650px; float:left; margin:0 0 20px 0;}
#main .twobythreetop{width:650px; height:10px; background:url(images/2by3-top.png) top center no-repeat; display:block; line-height:10px;}
#main .twobythreebottom{width:650px; height:10px; background:url(images/2by3-bottom.png); display:block;}
#main .twobythreecontent{width:630px; background:url(images/2by3-bg.png) repeat-y; overflow:hidden; padding:10px;}

#main .list ul{ margin:0; padding:0; list-style:none;}
#main .list li{width:580px; line-height:16px; background:url(images/h2-bg.png) left top no-repeat; padding:0 0 5px 50px; margin:0 0 15px 0; border-bottom:1px dotted #ccc; display:block; overflow:hidden;} 
#main .list li a:link, #main .twobythreecontent li a:visited{ font-weight:bold;}

#main .page ul{margin:0 0 0 0; padding:0 0 0 0; list-style:none;}
#main .page li{margin:0 0 5px 20px; padding:0 0 0 0; list-style:disc;} 

#main .details{padding:0 20px 0 20px; line-height:20px; background:url(images/details.gif) left no-repeat; display:block; float:left;}
#main .linkout{padding:0 20px 0 20px; line-height:20px; background:url(images/linkout.gif) left no-repeat; display:block; float:left;}
#main .comments{padding:0 20px 0 20px; line-height:20px; background:url(images/comments.gif) left no-repeat; display:block; float:left;}
#main .rating{line-height:20px; display:block; float:right;}

#main .sidebar{width:280px; float:right;}
#main .onebythree{width:280px; float:right; margin:0 0 20px 0;}
#main .onebythreetop{width:280px; height:10px; background:url(images/1by3-top.png); display:block;}
#main .onebythreebottom{width:280px; height:10px; background:url(images/1by3-bottom.png); display:block;}
#main .onebythreecontent{width:260px; background:url(images/1by3-bg.png) repeat-y; overflow:hidden; padding:10px;}

#main .newsletter{width:240px; height:188px; background:url(images/nl.png); display:block; margin:0 0 20px 0; padding:0 20px; color:#fff;}
#main .newsletter .in{border:0; margin:70px 10px 10px 10px; height:40px; width:220px;}
#main .newsletter .submit{border:0; margin:10px 0 0 0; height:27px; width:109px; background:url(images/submit.png);}

#main .sponsors{width:260px; overflow:hidden;}
#main .sponsors ul{margin:0; padding:0; list-style:none;}
#main .sponsors ul li{padding:0; width:125px; height:125px; margin:0 3px 5px 2px; display:block; background:#999; float:left;}

#footer{padding:20px 0 50px 0; border-top:5px solid #012950; color:#666; background:#ebebeb; margin:20px 0 0 0;}



#form .input1{border:1px solid #ccc; height:30px; width:320px;}
#form .area1{border:1px solid #ccc; height:90px; width:320px;}
#form .bt1{border:0; margin:10px 0 0 0; height:27px; width:109px; background:url(images/submit.png);}

.error
{
    color: #D8000C;
    background-color: #FFBABA;
    border: 1px solid;
    margin: 10px 0px;
    padding:15px 10px 15px 50px;
}
.success
{
    color: #4F8A10;
    background-color: #DFF2BF;
    border: 1px solid;
    margin: 10px 0px;
    padding:15px 10px 15px 50px;
}

[Beverleyh]

Your #sizewrap width is 990px wide - is that not what you intended? When you say its going the entire width of the page, do you only mean this 990px that you've declared, or literally 100% width of the screen regardless of resolution?

We're not seeing everything in context and there is a lot of CSS there that could be affecting things, but we don't know that because we don't know what the rest of your markup is doing.

Please post a link to the page as it makes it easier to offer help. Posting code fragments requires us to setup a page on your behalf so its more time consuming and awkward that giving us a link to your actual page.

[easyweb]

Not sure I can post websitelinks that are ours/ Got marked for ithere once.

But I will pmyou.

And yes, itgoes across the entire page, looks horrible, really looking for someone who can do some design work for a few dollars. Just top area.

I will pm you now.

T/y

[djr33]

You're welcome to post links in the context of a question. (In other contexts, they might be considered spam, but it's not a problem if you need to show us your page.)

Sometimes our automated spam filter will block messages that aren't spam-- if that happens we'll approve the message as soon as we see it. That doesn't usually happen, and I hope it doesn't happen here.

You could also post a plain text link (just remove http://www).

But in general, we do want you to be able to post these links so that everyone can see them and talk about the problem. It's better than using a PM, which is only seen by one person.

I hope that helps.

[easyweb]

It certainly dose help. Thank you for clearing that up for me.

The link with the menu issue is: scriptsdirectiory.info

( Yes,Misspelled on purpose )

I tried a few changes in css file, changed everything except what I want to change.

[Beverleyh]

Have you tried declaring your desired width on #menu, #sizewrap and the #sizewrap ul? Those won't necessarily all be needed in the final CSS but just for the sake of troubleshooting you can try matching them up to see if it helps.

I'm on iPhone at the mo so I can on make suggestions until back on PC

[easyweb]

Just tried, everything, but the orange menu width changed.

[easyweb]

Beverleyh

I left you a PM.

Thank you.