Display problems, for a change : HELP !

ermm i can’t help you with the web design, but i don’t seem to have a problem at all with gap in between your page; tried both in IF and firefox( homepage and few others to be safe) everything looks fine from my end..

btw i am using : IE 7 version 20061107.210142 ; Mozilla Firefox version 2.0.0.6

GL

The problem you’re experiencing most likely has to do with a flaw in IE’s rendering engine that’s been around since v4 or so and only affects floating elements. Considering the above comment, I suppose the latest build of IE7 has finally addressed it.

The flaw is characterized by the following behavior:

Any element with the CSS property “float” assigned will generate an unavoidable margin of approximately 3 pixels in width on the side corresponding to its float. That is, a DIV tag with “float: left;” in its style rules will appear to have an extra 3 pixels attached to its left edge, as if from a non-collapsing margin. Layouts with tightly-constrained column declarations suffer the most from this flaw, as some columns will be rendered other than expected to accommodate this extra space.

There are two fixes for this:

1) Declare a style rule that only applies to IE via contextual selectors. Ironically, due to another flaw in IE, any rule that begins with the contextual selectors “* html” will only be applied by IE versions 4 through 6. Those versions mistakenly believe that the HTML element ‘html’ has a parent element, when it obviously does not.

2) Define a style sheet or style rules that will only be read by IE. Unbeknownst to many developers, IE recognizes certain conditional statements included in standard HTML comments and even provides special variables for use within these conditionals, none of which are recognized by any other browser in existence. By wrapping a ‘style’ tag or ‘link’ tag in these special comments, you can define a style block or include a style sheet that will only be read by IE. This _will_ affect IE7, however, which still supports this unusual behavior.

In either case, use a _negative value_ for the margin rule to get IE to play nice with your columnar layout. Kudos on the table-free design.

well that appears also in the top. You have your background then when you put the semi-transparent blue layer to put your news (left side) and navigation links (right side) it darkened the wallpapers. Simple as that. and of course in my browsers both appear

Hello guys and thanks for the feedback

– Bugei : The W3C is extremist and even if there are certainly big mistakes in the code, they are lost in useless reports, alas Whining about center tags (yeah right, I should add even more divs that are just three times longer to write and not supported by the wordpress’ editor), or because there is no slash at the end of an img src, or because of javascript, or a href=http without “, or no alt= inside each picture hyperlink… this is a waste of time.

Just one example : “document type does not allow element “p” here;” was reported countless times, all my p align=”center” looking incorrect : WTF ???

Or border=”0″ is reported as faulty : the validator says “the document type you are using does not support that attribute for this element. This error is often caused by incorrect use of the “Strict” document type with a document that uses frames (e.g. you must use the “Transitional” document type to get the “target” attribute), or by using vendor proprietary extensions such as “marginheight” (this is usually fixed by using CSS to achieve the desired effect instead)”
WTF again ???

You see, I wouldn’t hate using the W3C validator tool, but it is really to extremist to be usable, even reporting valid html (like just above) for unknown reasons
The validator seems to say I declared the wrong document type, but look at my header, it says ontent=”text/html; charset=utf-8″

The validator says “The document is being served with the text/html Mime Type which is not a registered media type for the XHTML 1.1 Document Type. The recommended media type for this document is: application/xhtml+xml

Using a wrong media type for a certain document type may confuse the validator and other user agents with respect to the nature of the document, and you may get some erroneous validation errors. ” -> Yeah, but HOW, for god’s sake

-> That makes the validator useless

– Anonymous Stranger : eew, evil floats ! Thanks a lot for the tip, I’ll shrink a bit the left column and give those pixels to the two other columns, to see if that fixes the problem, thanks a lot

– Ludoman : errr, sorry i didn’t understand your point…

Hello Aavan, thanks for the reply,

The thing is I KNOW I should comply to those rules. For instance, not adding the final slash after an img src is bad lazyness, saving a few seconds of text processing.

But where more complex problems occur with yet “should-be” perfectly valid tags, the matters become impossible to manage, and I don’t see how I could comply to the W3C in such a case.

For instance, < script language="JavaScript" > means an error message, “required attribute “type” not specified.”. Illogical.

Or else, for that simple code : < p >Please, if you use IE, is it showing the same problem for you ? , the W3C validator returns “document type does not allow element “p” here; missing one of “object”, “applet”, “map”, “iframe”, “button”, “ins”, “del” start-tag.”
That doesn’t even make sense !

You see, I wouldn’t hate complying to the rules, I could fix about 30-40 errors in my page, but for the ~170 others, at some point, there is a conflict between common sense of coding and the validator’s prescriptions, and the deep logical reason behind that (there certainly is one, of that I do not doubt) is beyond my reach :-(

OMG, so much “pro” shittalking, i didn’t even care to read.
INFO for admin: Go and edit this file: http://www.hentairules.net/wp-content/themes/andreas-08-3-columns-ver-05/style.css

Go to line 205, and add under #sidebar{
this statement: vertical-align: top
That would be all

OMG so much “pro” shittalk.
Just edit your style.css. GO to line 205 and under #sidebar{ add this statement: vertical-align: top

Arse, your attempt to help was appreciated, I applied it into the css, but here is what the site looks like with IE6 with your style edit :

Not much improvement

Yeah, good trick, isn’t it, the semi-transparency ? That’s what I love most with the Dots Dark theme, i don’t regret the time I spent adapting it to wordpress (originally, it exists as a two-column-only blogger theme).

Actually, these are just two different background pictures repeated indefinitely defined by CSS. No transparency at all.
http://www.blogblog.com/dots_dark/bg_minidots.gif
and
http://www.blogblog.com/dots_dark/bg_minidots2.gif

So, Ludoman, even if I didn’t understand (again), I wonder if that will be pertinent ?

Ok, i see u added it, something wrong with my refreshing. And i found the problem which is “;” after this line, just delete it. Lol i didn’t suspect IE to be that much fucked browser.

OK Arse, IE is really hilarious

I just tested your suggestion, to put the vertical align top first in the sidebar css properties, without the ” ; ” in the end.

It worked.

Cool.

Then I posted a new blog note containing flash embedded elements, and BLAST!, the center column disappeared to reapper UNDER the left main column

I added the ” ; ” back, the center column came back, and the IE6’s bug was back too.

You know what ? Screw IE (anyway, everybody should use firefox with adblock, I sometimes think), and when I have more time i’ll just grab a few pixels here and there to give room to all the columns.

And that’s hilarious !

well its afterall 2 pics like you said oliver (at least now,didnt notice before,lol). I said it was semi-transparent because it looked like it but now it shows looking at the bubbles that are two pics one more brighter than the other. So the only way to put it is if you could put the darker image as a background of the site and be able to put in the actual darker backgrounds a transparent background. Well I guess i’m not much of a help,more like a problem,lol. Good luck with it