Css + Exploder Button Display Issue

[TrepaNation~]

Hello,I am having an issue with the way some versions of Explorer display a CSS styled button. Strangely I have that class of button used in multiple places on the site, but in one place in particular I cannot seem to fix it. Where-as all the other display correctly this one is broken into multiple lines and smashed to the rightSee the page here: http://mlkishigo.com/distributor-area.html See the bottom left side of the page. Second button down is the culprit.Here is a screenshot of the issue in IE:Here is a sample of the CSS I am using to style the button:/* Button Appearance */div.left-btn-2 { float: left; margin-top: 15px; margin-bottom: 10px; margin-right: 5px;} div.left-btn-2 a { text-decoration: none; font: bold 10px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Helvetica, Arial, sans-serif; padding: 6px 14px; color: #ffffff; outline: none; background: #f27300 url(../../images/glass-btn.png) repeat-x 0 50%; border-radius: 14px; -webkit-border-radius: 14px; -moz-border-radius: 14px;} div.left-btn-2 a:hover { border-color: #a14141; background-color: #ffffff; color: #f27300;}Any advice would be much appreciated!Thanks

[TrepaNation~]

BUMP- Can anybody help me out with this?I have been building out more of the site with the same CSS styled buttons and it is still doing this to some (not all) of the buttons. But only in Explorer.Thanks

[thescientist]

have you tried validating your site? There about 60+ errors alone with the transitional DTD you are using. If anythings going to foul up a page, its going to be IE running in something other than a Strict DTD.anyway, whats the surrounding HTML for that particular button?

[TrepaNation~]

Thanks for the quick reply.I have looked over the DTD validation link and can't quite figure out what to with it? Im a bit of a novice on programming so any advice you could give would be very much appreciated!The surrounding HTML of the buttons is... well, nothing. The button is an anchor in a css-class div. No style code of any kind.Thanks again!

[thescientist]

so the div its in has no styles applied to it?you use the validator by:*giving it a URL, or *uploading a file, or *by placing your code in it and clicking validate.

[TrepaNation~]

There are not HTML styles in the div, Just CSS <div class="...>So from what I gather I put in the url of the page I would like to validate, then it tells me the errors that need corrected. Is that the extent of its use or can it do more than that?This bring up another question... I did not design the site, rather I took over control of the site, about half finished, from the design firm my employer was using. From there I finished it and have continued to build it out. My question is can I change the DTD to something newer like HTML 4 or straight XML? Im no expert but XHTML 1.0 seems like it may be a little archaic. And would it be as easy as changing the specified DTD or would it be much more involved? Is there even any advantage to doing this?Just a thought... Let me know. Thanks!Alex~

[thescientist]

You should read up on DTD's, I think you may be a bit confused on what they are. In short, to try and answer your questions:DTD (doc type definition) is a set of rendering standards defined by the W3. When you include one of these on your page, the page will render elements on the page according what the definitions are; most browsers do this fine, IE is a bit wonky, and is almost useless for designing in unless you design to a strict DTD.The most common, and practical DTD to work against is HTML 4.01 (you wouldn't use an XML DTD for an HTML page, apples and oranges). XHTML is not archaic, it will just be superceded most likely by HTML5, but if you use XML, then you should use it.When you change the DTD (to Strict), and validate, you will more often than not find more errors, because a "softer" DTD like transitional DTD, will more or less suppress more errors, at the expense of letting you get away with deprecated code. Strict straightens out webpages, forces them to render to stricter standards, and since most (minus IE) all pretty much render the same way in Strict mode, you'll have more assurance that the page your creating will render properly, and too expectations, across multiple browsers.

[Synook]

The most commonly used XML-based language for the purpose of creating web pages is XHTML. The version of XHTML that in terms of elements, attributes, etc. matches HTML 4.01 is XHTML 1.0. When HTML 5 comes out there will be an XML-based version known as XHTML 5.

So from what I gather I put in the url of the page I would like to validate, then it tells me the errors that need corrected. Is that the extent of its use or can it do more than that?

No - that is all it does. It is up to you to fix the errors.If you change the DTD, then you need to change the page so that it matches that DTD.

[TrepaNation~]

Thanks guys, yeah I was a bit confused but your input has helped quite a bit.