IE 5.5 div not centered

Lchad · #1 Mar 27th, 2007, 21:33

Since I have a <div> that is 770 pixels wide but also has padding of 50 pixels on right and left, I need some type of hack to center this div for IE 5.5 because it doesn't like the padding.

I read that I should use

Code: Select all

#seal { \width: 770px; } /* for IE5/Win */

But it messes up all the current browsers.

Could someone tell me how to correctly use the hack?

I can't post the site because I don't want it to show up in SE's.
The css code I have now is

Code: Select all

#content {
	background: url(graphics/back_container.jpg) 0px 186px;
	width: 670px;
	margin: 0 auto;
	padding: 15px 50px 0px 50px;
	clear: both;
	text-align: left;
	}

What could I include to get IE 5.5 to like this?
Thanks in advance!

karinne · #2 Mar 27th, 2007, 21:41

Add text-align: center; to the parent div.

So ... if #content is child of body then

Code: Select all

body {
  text-align: center;
}

 #content {
    background: url(graphics/back_container.jpg) 0px 186px;
    width: 670px;
    margin: 0 auto;
    padding: 15px 50px 0px 50px;
    clear: both;
    text-align: left;
    }

Lchad · #3 Mar 27th, 2007, 21:50

Sorry Karinne, I do have that. The parent is centered.

I think I need to work around the padding issue. IE 5.5 doesn't like padding.

Ryan Fait · #4 Mar 27th, 2007, 22:44

Nesting div's is really the only solution to "fixing" the box model in IE.

karinne · #5 Mar 28th, 2007, 12:03

Linda ... if you didn't figure it out yet, give us a link ... if not ... post the answer

Lchad · #6 Mar 28th, 2007, 12:59

I haven't actually used the hack but the box hack can be found here.

I can't post the link because it's for a State Representative. I can't take the risk of having it show up in Google under webforumz.

I think I'm going to have to implement the box hack because I would imagine many of her visitors are going to be older and possibly still using IE 5.5. Thoughts?

karinne · #7 Mar 28th, 2007, 13:14

OK .. well ... can you at least give us more code?

Lchad · #8 Mar 28th, 2007, 13:48

Here's the html revised a bit to take out any info

Code: Select all

<div id="header"><h1>Client Name here</h1>    
    <ul id="navigation">
        <li><a href="/" class="selected">Home</a></li>
        <li><a href="bio.html">Bio</a></li>
        <li><a href="blog.html">Blog</a></li>
        <li><a href="contact.html">Contact</a></li>
    </ul>
</div>    
<div id="content">
  <p><span class="boldtext">Client name</span>, a 1969 graduate Blah</p>
 
  
</div>
<div id="seal"></div>
<div id="footer">&quot;Tagline here&quot;</div>

The div in red is the part that is not aligning in IE 5.5.

The css for it is:

Code: Select all

* {
    margin: 0;
    padding: 0;
}

html {
    background: #dadada url(graphics/background_page.jpg) repeat-x 0 0;
    }

body {
    margin: 0 auto;
    text-align: center;
    
    }

#header {
    background: url(graphics/header.jpg) no-repeat;
    height: 184px;
    width: 790px;
    margin: 0 auto;
    text-align: left;
    }

#content {
    background: url(graphics/back_container.jpg) 0px 186px;
    width: 670px;
    margin: 0 auto;
    padding: 15px 50px 0px 50px;
    clear: both;
    text-align: left;
    }

There I think that's all the bits and pieces you need.

karinne · #9 Mar 28th, 2007, 14:22

Well ... it's hard to say what will help since I don't have IE5.5 installed here but... a few things I see that's wrong with the code above is:

You must add a width (width: 790px

to your body { } and your #content width should be 690px since 50+50 = 100.

Ryan Fait · #10 Mar 29th, 2007, 01:46

You might be interested, Karinne: http://tredosoft.com/Multiple_IE

Allows you to have IE 3 through 6. Not that anyone is using 3 or 4, but it's sometimes to look for the hell of it.

JacobHaug · #11 Mar 29th, 2007, 04:49

Yeah, I can't thank you enough for posting that on here Ryan. I feel like jumping up and down for JOY!!

Ryan Fait · #12 Mar 29th, 2007, 07:56

Hehe, moojoo found it first. I jumped up and down with joy when he gave me that link

karinne · #13 Mar 29th, 2007, 12:15

Meh ... I don't support IE5.5 or lower. IE6 yes but not lower than that!

Lchad · #14 Mar 29th, 2007, 12:45

I just check my browser stats today and I have .7% of the people using IE 5.5. Not too many!

karinne · #15 Mar 29th, 2007, 12:50

I have none

Lchad · #16 Mar 29th, 2007, 13:01

lucky you!

karinne · #17 Mar 29th, 2007, 13:05

Your .7% is probably from a while back too you know. I doubt it's very recent. Depending on how long you've been keeping stats, I doubt you had 5.5 users very recently. I wouldn't worry too much about them or the support of them.

That's my opinion of course

Lchad · #18 Mar 29th, 2007, 14:01

Linda *High 5's* Karinne in complete agreement.... shhhhhhhhh don't tell Ryan!

karinne · #19 Mar 29th, 2007, 14:02

It will be our little secret

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
IE 5.5 div not centered