...

View Full Version : div stretching out to far horizontally in IE



mhunt
06-02-2005, 09:29 PM
if you look at http://www.nextstepdevelopments.net in Internet explorer you'll see that the right of the #container div stretches out past where its supposed to, which is the end of the navigation bar.

in firefox it looks perfect, I've looked at the css file for around 20 minutes and i'm just not seeing the problem.

http://www.nextstepdevelopments.net/layout.css is the CSS file.

Any help will be greatly appreciated

s.g.d
06-02-2005, 09:44 PM
if ever i have a problem like this, i always give each div a 1px border to see what is going where.

i have a feeling it might be the right margin on your pagetext div, it might be pushing something out? the container can only hold so much :p

mhunt
06-02-2005, 09:55 PM
I changed the pagetext div's right margin to 0 and that moved it in about 75% of the distance, so im guessing one of the other div's is pushing it out a little too

thanks!

s.g.d
06-02-2005, 10:06 PM
:thumbsup: no worries.

mhunt
06-02-2005, 10:09 PM
ok so i can't figure out what other div is pushing it out :(
theres still like a 10px gap there and it wont go away haha

canadianjameson
06-02-2005, 10:13 PM
did you ask it nicely? :D

just kidding... lemme take another look

mhunt
06-02-2005, 10:13 PM
i wish it were that easy

mhunt
06-02-2005, 10:41 PM
*sadface*

canadianjameson
06-03-2005, 05:00 AM
cant anyone fix This?



/*Debugging Tool
div {border: solid 1px #f00;}
*/
body {
background-color:#386e7c;
margin: 0px;
padding: 0px;
}
p {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
line-height: 1.5em;
padding: 0px;
margin: 30px 0px 0px 0px;
}
h1 {
margin: 0px;
padding: 0px;
}
h2 {
margin: 0px;
padding: 0px;
}
h3 {
margin: 0px;
padding: 0px;
}
h6 {
margin: 0px 0px -15px 0px;
padding: 0px;
font-family:Verdana, Arial, Helvetica, sans-serif;
}
ul, li {
list-style-type:none;
}
a {
text-decoration: none;
color:#ff0000;
width: 108px;
padding: 0px 5px 0px 5px;
}
form {
padding: 0px;
margin: 0px;
}
#container {
background-image:url("logo_three.gif");
background-repeat:no-repeat;
background-position:left top;
background-color: #fff;
padding: 0px;
margin-left: -312px;
position: absolute;
width: 625px;
left: 50%;
top: 0px;
border: 1px solid #000000;
height: 700px;
}
#subnavigation {
position:absolute;
left: 200px;
top: 109px;
width: 424px;
height: 20px;
border-bottom:1px solid #000;
margin: 5px 0px 0px 0px;
padding: 0px;
}
#subnavigation a {
text-decoration: none;
color:#ff0000;
margin: 0px 0px 0px 0px;
padding: 0px 10px 0px 5px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
line-height:5px;
}
#subnavigation a:hover {
text-decoration: underline;
color:#000000;
margin: 0px 0px 0px 0px;
padding: 0px 10px 0px 5px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
line-height:5px;
}
#content {
margin: 0px;
}
#menubar {
position: absolute;
width: 585px;
left: 0px;
top: 90px;
background-color: #FFFFFF;
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
padding: 0px 0px 0px 40px;
margin:0px;
height: 21px;
}
#menubar ul li {
list-style-type: none;
display: inline;
margin: 0px 46px 0px 0px;
padding: 0px;
}
#menubar ul {
margin: 0px 0px 0px 56px;
padding: 0px;
}
#menubar a {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color:#ff0000;
text-decoration: none;
margin: 0px;
display: inline;
}
#menubar a:hover {
color: #000000;
margin: 0px;
}
#news {
width: 190px;
border: 1px solid #000;
margin: 0px;
padding: 5px;
position: absolute;
left: -1px;
top:229px;
height: 460px;
}
#news p {
padding: 0px;
margin: 0px;
font-family:Arial, Helvetica, sans-serif;
color:#000000;
font-size:12px;
}
#nsd h2 {
display: none;
margin:0px;
padding: 0px;
}
#nsd h1 {
padding: 0px;
height: 75px;
width: 625px;
background-repeat: no-repeat;
margin: -21px 0px 0px 13px;
position:relative;
}
#login {
width: 190px;
border: 1px solid #000000;
margin: 0px;
padding: 5px;
position: absolute;
left: -1px;
top: 112px;
height: 106px;
}
#pagetext {
margin: 60px 0px 0px 210px;
padding: 4px;
width: 370px;
height: 500px;
}
#pagetext p {
padding: 0px 0px 0px 0px;
}
#login label {
padding: 0px;
margin: 0px;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #660000;
font-size: 10px;
}
#update {
margin: 85px 0px 0px 210px;
padding: 4px;
width: 370px;
overflow:auto;
}
#username {
margin: 0px;
padding: 0px;
}
#password {
margin: 0px;
padding: 0px;
}
#standards {
padding: 0px;
margin: 0px;
}
.logintextbox {
background-color:#386e7c;
color: #fff;
}
.button {
background-color: #386e7c;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;
}
.hide {
display: none;
}
.firstletter {
font-weight:bold;
}

canadianjameson
06-03-2005, 02:48 PM
anyone have any ideas?

this has got me stumped too...

Mark, post the CSS code. might help

ronaldb66
06-03-2005, 03:23 PM
Take the width off of the #pagetext div; leaving it to default and controlling whitespace with margins should work.

channy
06-03-2005, 03:44 PM
its a block element that's causing the problem. I think it's your


<h1><span class="hide">NextStep Developments</span></h1>

on my test here at work I dumped it down to an h2 and it got rid of the extra space...

mhunt
06-03-2005, 07:56 PM
thanks a lot guys, it was a combo of both of those things you suggested that fixed it :) :thumbsup:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum