bronzemonkey

I don't think you should be worrying about fixing minor issues in a beta-version of a new browser. No one bothers with the IE8 beta either. However, Chrome is based on webkit and so you would expect it to be fine. Why don't you post the actual html source of the page (i.e. not your raw code with php in it) and the entire stylesheet, or provide a link to the actual page this is happening on, so that people can actually do some testing.

A definition list tag is <dl>. That can contain the children <dt> and <dd> - it is unique in having list items consisting of 2 parts. A definition list is semantically correct, in HTML4, for term/definition-description data. In HTML5 (at the moment) it is going to be semantically correct for any name-value data...more a "description list". In either case, it is semantically incorrect to use a <dl> for navigation. The <ul> tag is semantically different. It is an unordered list...which is precisely what the vast majority of navigation links are. It is semantically correct to present a site's navigation as an unordered list. It is nothing to do with css. Even if you were not styling your HTML document, an unordered list is most appropriate for navigation. Just because CSS can be used to alter the presentation of this list does not mean that a list is being used for "layout". The HTML 4.01 spec itself says: http://www.w3.org/TR/html401/struct/lists.html#h-10.4

I've probably been using HTML/CSS/JS/PHP/AJAX for less time than all of you. CSS is not a hack. It was specifically introduced by the w3c to get away from the "hack" of using tables to present and layout websites. Instead, you use semantically correct html (to accurately convey structural meaning to the information that a site is composed of) and then use CSS to present this information visually - that includes changing position and appearance. Who is using definition lists for layout? I've never seen a site layout created using definition lists...it certainly wouldn't be semantically correct. If someone uses CSS to position the contents of a dt to the left of the contents of a dd (assuming a dl is the semantically correct)...then that is perfectly in keeping with what CSS was introduced to allow. HTML is now there to give meaning to content, not to present it.

You can install your own local server very easily using: WAMP - http://www.wampserver.com/en/ or XAMPP - http://www.apachefriends.org/en/xampp.html That way you can do all your own testing, use php to build your templates, and entire sites on your own system and across browsers without having to upload anything to an external server. You can have as many sites as you want, or variants of them, and create your own URLs to view them.

And this is exactly why anyone who does client work has to support IE6. To not do so is unacceptable I'm afraid.

Did you even try out that simple bit of code? I think not, because then you wouldn't be asking (again) for something that has already been solved for you.

That's right. The vast majority of rendering issues in IE can be resolved by triggering hasLayout like this. Any time you need to get an element to clear its internal floats in IE, just trigger hasLayout with those declarations. They will also prevent those bizarre rendering problems on navigation blocks when you haven't set height/width dimensions and/or you have background images on the ul/li/a elements. In contrast to the "float nearly everything" method of clearing floats (which can often produce "peekaboo" rendering errors in IE6 that cannot be resolved) it is a very robust method of clearing.

Yeah, usually my IE7 stylesheet will just have a bunch of {min-height:0} declarations to trigger hasLayout in a few elements. Occasionally a couple of other fixes. My IE6 stylesheet will have: - {zoom:1} declarations to trigger hasLayout - {display:inline} to correct any double-margin rendering - {height:*} declarations for min-height emulation - some IE expressions to emulate :first-child if it's being used (as well as IE6 specific overrides of the same properties to make sure the layout is still preserved - if not exactly replicated - with JS disabled) - and then any misc corrections It's always structured by specific groups of fixes because IE6's difficulties are totally predictable and often very easily overcome. I don't find it a difficulty to accommodate the browser, even though I will still encounter moments when a complex layout requires a bit of thought to get it working in IE6.

If you're doing client work, you need to support IE6. It still has significant market share. You can download the tredosoft multiple-IEs to get a version of IE6 to run alongside your IE7 (or vice versa) for testing purposes.

I think that any additional code whatsoever that is needed to get any version of IE to play along, should be in a specific conditional stylesheet.

Don't use tables for layout...use them to display tabular data. You use css to style html...any type of html.

Sorry, but you're wrong. If you do what I suggest above then it will show. I have tested it.

The better clearing methods not only do all that, but avoid you having to go into the markup to clear.

.mydiv img {width:80%;}

It's a float clearing issue. Either float all the boxes as haku said, use overflow:hidden on the container that is not floated but contains floated elements, or google "clearfix".

You should always use em or percentages for font-size otherwise IE users will not be able to resize text. Using em/px/% for anything else depends on the layout you are trying to construct.

When are people going to understand that without posting your code there is not much chance of getting useful help. Have you even reset the default browser styles on tags such as div?

Don't even need to use a pre tag, just the css property-value of {white-space:pre;} on the element. I can't see a reason to actually do this anyway. But if you can think of some kind of robust logic in the nature of the sentences then you can always use php to do some calculations and write in the correct number of spaces before the repeated word on the second line to get it aligned. As haku said, you'll also need to make sure that the characters in the font are all the same width.

If you were laying out a poem (some of which have their text laid out in a specific pattern) you would use {white-space:pre;} to preserve the white-space in the html source. You should try that out. Apply that css to a specific paragraph where the source looks like: this is an apple apple is good

you should also be using form elements to structure a form. see w3c schools or the html 4.01 spec form more details

Add {position:relative;} to #container. Add {top:134px; left:575px;} to, and remove all margin and float declarations from, #conributemenu

It is not your place to tell people what browser to use especially since some people do not have a choice. The stats are there; ie6 still has significant market share and will continue to do so until business (on a mass scale) migrate away from XP SP1. No professional developer can avoid supporting IE6 on any client projects. You think you're the only one building complex sites? There are also limits as to what designs are appropriate for the web - providing an unusable mess in the name of "innovation" is not something to aim for. And we're not talking about pie-in-the-sky websites that aren't even going to be completed within the next 3 years. Anyone building professional sites at this time needs to be supporting IE6. It's that simple. If you know your code then it isn't even that hard to get IE6 to play along the vast majority of the time.

Why aren't you? Unless it's just for little personal projects, you need to support a browser which still has ~30% market share. It's common sense.

either float the content div left too. or you can use the clearfix (or variation) solution. google it.

download the firefox extension called "firebug" and inspect the element in question. the "border-radius" property is being used. it will likely be included in the css3 spec.