CSS aligment of single post

I don’t see the error your talking about in either Firefox 3b5 or IE6.

Hmmm… yes I see the problem with Opera. FireFox and Internet Explorer 7 & 8beta look fine.
IE6? I’m sorry jeremyclark13, no hard feelings, but that’s a 7 year old browser that’s highly non-standards compliant.

I did however check if your CSS and XHTML validate, and guess what?

Your CSS is fine but there are some errors in the XHTML.

go to https://validator.w3.org/ and check for yourself. Chances are you fix the code, you fix the problem.

PS. this line of code is the problem.

<comment><h1 style="display:inline; font-size:14px;"></comment>

Delete it, you don’t need it

IE6? I’m sorry jeremyclark13, no hard feelings, but that’s a 7 year old browser that’s highly non-standards compliant.

That’s exactly why I still keep it around. Because it’s still a big percentage of market share of browsers. I dabble in web design and you have to take into account everybody and their grandma. I’ve found IE7 and Firefox to usually match pretty well, as you found out yourself, that is why I neglected to check with IE7.

I agree 100% Jeremy, I do a little more than dabble in webdesign myself and I always take IE6 in account with every project I take on. In fact I create a separate stylesheet just for IE6.

I wasn’t trying to offend or discredit you in any way, I was just trying to make the point that the W3C webstandards are far more important than how it’s rendered in any particular browser, especially IE6.
Microsoft has been getting away with murder when it comes to webstandards. Unfortunately the majority of the people browsing the web use some version of IE because it was pre-installed and don’t know there are other browsers out there. They see IE as part of Windows.

When I check the web logs of the different sites I’m running, it tells me that the use of IE6 is down to 20.41% of the visitors. It is my opinion, that making your websites future browser proof is more important than past browser proof. This doesn’t mean I neglect past browsers but the current and up and coming browsers are higher on my list.

I’m also just trying to wake people up to the fact that there are other (better) browsers out there than IE. Sometimes my frustration about the general ignorance about this, gets the better of me and my comments end up being perceived as smug or derogatory. This is not my intention. I’m sorry if I was unclear in the point I was trying to make.

@jberghem: No offense taken ??

I understand your point completely.

I’m also just trying to wake people up to the fact that there are other (better) browsers out there than IE

How’s that coming? ?? I think most people have taken a super sized Microsoft sleeping pill.

@jeremyclark13

Little by little.
I also install quite a few PC’s and help a lot of people in general.
Showing the difference seems to work best. There are few demo sites out there that work as a real eye-opener. especially to IE6 users who are still used to viewing the web through a sub-standard CSS 1 window while CSS 3 has already been in development for several years.

Paragraphs in columns and multiple backgrounds per element, I can’t wait!!

thnks for the replies,

it was a stimulating read regarding the age old discussion of browser back compatability and appreciate both of your thoughts.

Since my problem occurs only in ie6 then should i forget about this little issue?

I’d like to sort it out, these kinds of little things pester me to try and resolve them. I know a few ppl who use ie6 a lot.

If anyone has any ideas on what line of code is causing this to happen (see 1st post in thread) id appreciate a pointer,

thanks again guys.

You need to add a closing div ( </div> ) just inside the </body> tag in your footer.php for the <div id="container"> that’s started in the header.php. Remember when you post an image for real in a post that you need to ad an “alt” attribute. On the single post page you have this tag <comment>. The <comment> tag doesn’t exist in (X)HTML. There is a tag to write comments in your (X)HTML that are ignored by the browser which look like this: <!-- --> They are called comment tags but there is no <comment> </comment> There is also a lost </a> tag on line 146. Your <textarea> is missing the required “rows” and “cols” attribute. Fix those and check again. If IE6 is till acting up then its a IE6 problem.

Yes the age old IE6 problem. IE6 behaves differently when it comes to margins and padding, it adds everything up and other browsers don’t. although there are hacks you can add in your stylesheet, I’ve never liked them. You always run the risk of a new browser acting funny because of them. As I wrote in my previous post I just make a separate stylesheet for IE6. It works like this. Open your header.php file in the theme you use and add the the following code:

<!--[if lte IE 6]>
<link href="/path/to/theme/style_ie6.css" rel="stylesheet" type="text/css" media="screen" />
<![endif]-->

This code needs to be placed after the link to the style.css because it needs to overide the the code in it. Then you make a new css file named style_ie6.css and place it in the folder where you pointed the link to.

In the style_ie6.css file you change the values of the selector that’s causing the problem in IE6.

The <!–[if lte IE 6]> is only read by IE. This rule basicaly says: if less than or equal to IE6 do/or show whatever follows.

This is how it works: all other browsers ignore the whole link to the extra css file. IE6 (and earlier versions) will fist read the style.css and then the style_ie6.css. When the styles in the two files conflict, it will use the style in the style_ie6.css file because it comes after the style.css. To make it easier for yourself just make a copy of the style.css and rename it to style_ie6.css. Change it so that it look right in IE6 and then delete everything in the stylesheet except for the lines you changed. It is important to delete what you haven’t changed otherwise you have to keep both files up to date when you make a change.