LiveWire Network Peer Answers Peer Support Teen Forums Tech Forums College Forums 657 users online 225113 members 1555 active today Advertise Here Sign In
TeenCollegeTechPhotos | Quizzes | LiveSecret | Memberlist | Dictionary | News | FAQ
Member Spotlight
kanyeEast
Peeves: Ugly people who think they're attracti...
Mood: Flirty
You have 1 new message.
Emergency Help
Until you sign up you can't do much. Yes, it's free.

Sign Up Now
Membername:
Password:
Already have an account?
► Invite Friends
► Active Members
► Groups
► Contests
Moderators
5 online / 28 MPM
Fresh Topics
  LiveWire / Technical Forums / Web Design & Search Engine Optimization / Adding Reply

Quoting Post
Archived Topic: It will not be bumped to the top of the forum.
Topic IE6 CSS width issue
Membername   Not a member? Sign Up Free (takes 20 seconds)
Password   Forgotten your password?
Post

 Font:   Size:   Color:

FAQ Keyword Search:
Post Options
Favorites Manager
Notify me of new replies to this topic by email
Notify me of new replies to this topic by private message
Original Post
allsmiles Posted at 7:06 am on Mar. 12, 2008
I'm designing a website for a financial endeavour of mine, which will only be used by people who browse with IE. I don't know if it works right in IE7, since I don't have it and my dad doesn't want me to install it on this machine (I'm not complaining), but in IE6, when I put in width: 100%; for one of the divs, there's a gap at the right hand side of it, 20px wide (regardless of resolution, it seems). The design works perfectly in Fx.

Here's the source code for the design:

Code:
<html>

<head>

<title>Parts Stock Locator</title>

<style type="text/css">

.delivery {
float: right;
width: 200px;
height: 35px;
background-color: #fff;
text-family: verdana;
font-size: 10px;
border-left: solid 2px #000;
border-bottom: solid 2px #000;
text-align: center;

}

.top {

height: 200px;
position: absolute;
top: 0px;
left: 0px;
width: 100%;
background-color: #99f;
border-bottom: solid 3px #00f;
text-align: center;
font-family: verdana;
font-size: 12px;

}

a {
color: #777;
text-decoration: underline;

}

a:hover {
color: #ccc;
text-decoration: none;
text-weight: bold;

}

a:visited {
color: #777;
text-decoration: underline;

}

.search {

height: 25px;
font-size: 18px;
font-family: verdana;
font-color: #000;
border: solid 1px #000;

}

td, th, {

font-family: verdana;
font-size: 12px;

}

.content {

font-family: verdana;
font-size: 12px;
width: 95%;
text-align: center;

}


</style>

</head>

<body>

<div class="top">

<div class="delivery">
<br />
<a href="http://www.royalmail.com/portal/rm/jump2?catId=400028&mediaId=400031";>Recommended Delivery Service</a>
</div>

<p><img src="title.png" alt="Parts Stock Locator" style="position: relative; left: 100px;" /></p>

<p>### hits since 25/02/08</p>

<p>Input part number, partial part number, or description</p>

<p><form action="search.php" method="post"><input type="text" name="part" maxlength="20" class="search" />      <input type="submit" name="search" value="search" /></form></p>

</div>

<div class="content">

 

</div>

</body>

</html>

I'm not that experienced with CSS based layouts, so I don't really have much hope of diagnosing the problem. Can you see what needs changing?

Replies
allsmiles Posted at 5:38 am on Mar. 13, 2008
That fixed it. Thank you very much!
PiXiE Posted at 9:40 pm on Mar. 12, 2008
html, body {
margin:0px;
padding:0px;
}
allsmiles Posted at 7:59 am on Mar. 12, 2008
Didn't IE8 pass the Acid2 test though?
Boss302 Posted at 7:39 am on Mar. 12, 2008
IE8 is coming out soon (in beta atm) so you'll have another set of problems to sort out!
allsmiles Posted at 7:27 am on Mar. 12, 2008
There are only 2 pages on the site, and they're not likely to ever change once finalised.

Thing is, I'm only fucking around with the layout 'cos some grumpy tech guy at the company I'm doing this for, who's pissed off cos my hosting's steep, is basically shooting down everything I do. A gap on the right is not likely to be accepted :(

marshmellowman Posted at 7:10 am on Mar. 12, 2008
It looks fine, but as a side note, it's better to have the CSS in an external stylesheet than embedding it in every single page. It's much easier to change the global settings this way. (ie, reference style.css)

IE6 has been long known to have such problems, and there are many things that are legitimate CSS codes that fuck up IE.

All 6 previous replies displayed.

© 2000-2009 LiveWire Peer Support Network
Custom Web Hosting | Teen Advice | Peer Support