Re: [jQuery] Tabs plugin / CSS problem
Klaus Hartl schrieb: > In IE, if you use a Doctype with a System Identifier (URL) it will > render in Quirks Mode (at least with XHTML and HTML 4 Doctypes - I > really don't know/care about HTML 3): That should have been: In IE, if you use a Doctype with a System Identifier (URL) it will render in *Standards* Mode. -- Klaus ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
Re: [jQuery] Tabs plugin / CSS problem
Sam Collett schrieb: > In IE it doesn't make a difference in rendering whether you use HTML4 > or XHTML as the DOCTYPE. You could probably even have HTML 3 as the > DOCTYPE and still have it render the same. > > Mozilla on the other hand, does sniff DOCTYPE: > http://developer.mozilla.org/en/docs/Mozilla's_DOCTYPE_sniffing > > 3 modes: Full Standards Mode, Almost Standards Mode (only for HTML 4 / > XHTML 1.0 Transitional / Frameset) and Quirks Mode. That's not true. IE 6+ does have a Standards and a Quirks Mode. I'm sure MS invented the whole thing to overcome the incorrectly implemented box model in IE 5. Thats why IE 6 in Quirks Mode will use the old box model, whereas IE 6 in Standards Mode will use the standards compliant (W3C) box model. In IE, if you use a Doctype with a System Identifier (URL) it will render in Quirks Mode (at least with XHTML and HTML 4 Doctypes - I really don't know/care about HTML 3): http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";> It will render in Quirks mode if you omit the System Identifier: It will also render in Quirks mode if you put an HTML or an xml declaration comment before the Doctype declaration: http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";> http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";> Here's a pretty good overview: http://hsivonen.iki.fi/doctype/ -- Klaus ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
Re: [jQuery] Tabs plugin / CSS problem
On 27/02/07, Klaus Hartl <[EMAIL PROTECTED]> wrote: > Wilfred Nas schrieb: > > Klaus, > > > > you are right, my fault (too lazy with copy and pasting as it is still > > early) > > > > but Doctype does matter when rendering, see > > > > http://www.quirksmode.org/css/quirksmode.html > > Yes I know - thats why I pointed out, that the xml declaration will put > IE into quirks mode again :-) > > > -- Klaus In IE it doesn't make a difference in rendering whether you use HTML4 or XHTML as the DOCTYPE. You could probably even have HTML 3 as the DOCTYPE and still have it render the same. Mozilla on the other hand, does sniff DOCTYPE: http://developer.mozilla.org/en/docs/Mozilla's_DOCTYPE_sniffing 3 modes: Full Standards Mode, Almost Standards Mode (only for HTML 4 / XHTML 1.0 Transitional / Frameset) and Quirks Mode. ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
Re: [jQuery] Tabs plugin / CSS problem
Wilfred Nas schrieb: > Klaus, > > you are right, my fault (too lazy with copy and pasting as it is still > early) > > but Doctype does matter when rendering, see > > http://www.quirksmode.org/css/quirksmode.html Yes I know - thats why I pointed out, that the xml declaration will put IE into quirks mode again :-) -- Klaus ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
Re: [jQuery] Tabs plugin / CSS problem
Klaus, you are right, my fault (too lazy with copy and pasting as it is still early) but Doctype does matter when rendering, see http://www.quirksmode.org/css/quirksmode.html On Feb 27, 2007, at 8:39 AM, Klaus Hartl wrote: Wilfred Nas schrieb: you may want to start with giving the page a proper doctype. than you want to nullify the default margin and padding that an unordered list has... Further more, as I read your 'problem' you assume that is correct in other browsers? Which one, surely not IE 6. When developing, start with firefox, safari or other decent browsers and then work your way down to the various IE versions. Preferably with conditional comments... When I added a doctype to your page: http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> Do not use an XML declaration if you are serving as text/html. It's wrong. It's simply HTML, not XML. Mime type matters, Doctypes don't. Besides using this declaration puts IE in Quirks mode again, thus you don't win anything and it's actually the same as having no Doctype at all. -- Klaus ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/ met vriendelijke groet Wilfred Nas user interface specialist e [EMAIL PROTECTED] w www.wnas.nl ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
Re: [jQuery] Tabs plugin / CSS problem
Wilfred Nas schrieb: > you may want to start with giving the page a proper doctype. > > than you want to nullify the default margin and padding that an > unordered list has... > > Further more, as I read your 'problem' you assume that is correct in > other browsers? Which one, surely not IE 6. When developing, start with > firefox, safari or other decent browsers and then work your way down to > the various IE versions. Preferably with conditional comments... > > When I added a doctype to your page: > > > "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> Do not use an XML declaration if you are serving as text/html. It's wrong. It's simply HTML, not XML. Mime type matters, Doctypes don't. Besides using this declaration puts IE in Quirks mode again, thus you don't win anything and it's actually the same as having no Doctype at all. -- Klaus ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
Re: [jQuery] Tabs plugin / CSS problem
you may want to start with giving the page a proper doctype. than you want to nullify the default margin and padding that an unordered list has... Further more, as I read your 'problem' you assume that is correct in other browsers? Which one, surely not IE 6. When developing, start with firefox, safari or other decent browsers and then work your way down to the various IE versions. Preferably with conditional comments... When I added a doctype to your page: "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> http://www.w3.org/1999/xhtml";> and the following css for you tabs it looks okay in ff 2 #container-1 ul.anchors { margin: 0; padding: 0; } to get the content to connect, I added: .fragment { margin-top: -10px; } Please take a look at the specs at w3c and good luck! On Feb 27, 2007, at 6:35 AM, Dylan Verheul wrote: On this page I've setup a test for the tabs plugin which I want to use. http://waarneming.nl/h/default/test The layout is wrong in FF2 (tabs are too high and too far to the right) and in IE7 (everything looks messed up). The scripts and the CSS are inserted through php calls in a small framework. This works fine for thickbox and such, but I can't get tabs to work. I've been staring at it for a long time, so maybe I'm just missing the obvious (most probably the obvious mistake I made). If anyone would like to help me out, please take a look. Dylan ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/ cheers Wilfred Nas user interface specialist e [EMAIL PROTECTED] w www.wnas.nl ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
Re: [jQuery] Tabs plugin / CSS problem
OK thanks, I thought the tabs CSS overrode the #main ul with it's .anchors definition -- I'll look into it, might have to tighten up the style sheets to make 'em play nice ... On 2/27/07, David <[EMAIL PROTECTED]> wrote: > > hi Dylan, > > As a quick test in Firefox2.0 I removed the '#main ul' and 'H3' styles from > your css, and that got rid of the space between the tabs and the tab > content. You may need to play with the margin values to get it to wrok the > way you want. > > Regards, > > David > > Dylan Verheul wrote: > > On this page I've setup a test for the tabs plugin which I want to use. > http://waarneming.nl/h/default/test > > The layout is wrong in FF2 (tabs are too high and too far to the > right) and in IE7 (everything looks messed up). > > The scripts and the CSS are inserted through php calls in a small > framework. This works fine for thickbox and such, but I can't get tabs > to work. I've been staring at it for a long time, so maybe I'm just > missing the obvious (most probably the obvious mistake I made). > > If anyone would like to help me out, please take a look. > > Dylan > > ___ > jQuery mailing list > discuss@jquery.com > http://jquery.com/discuss/ > > > > > > ___ > jQuery mailing list > discuss@jquery.com > http://jquery.com/discuss/ > > ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
Re: [jQuery] Tabs plugin / CSS problem
hi Dylan, As a quick test in Firefox2.0 I removed the '#main ul' and 'H3' styles from your css, and that got rid of the space between the tabs and the tab content. You may need to play with the margin values to get it to wrok the way you want. Regards, David Dylan Verheul wrote: > On this page I've setup a test for the tabs plugin which I want to use. > http://waarneming.nl/h/default/test > > The layout is wrong in FF2 (tabs are too high and too far to the > right) and in IE7 (everything looks messed up). > > The scripts and the CSS are inserted through php calls in a small > framework. This works fine for thickbox and such, but I can't get tabs > to work. I've been staring at it for a long time, so maybe I'm just > missing the obvious (most probably the obvious mistake I made). > > If anyone would like to help me out, please take a look. > > Dylan > > ___ > jQuery mailing list > discuss@jquery.com > http://jquery.com/discuss/ > > > > ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
[jQuery] Tabs plugin / CSS problem
On this page I've setup a test for the tabs plugin which I want to use. http://waarneming.nl/h/default/test The layout is wrong in FF2 (tabs are too high and too far to the right) and in IE7 (everything looks messed up). The scripts and the CSS are inserted through php calls in a small framework. This works fine for thickbox and such, but I can't get tabs to work. I've been staring at it for a long time, so maybe I'm just missing the obvious (most probably the obvious mistake I made). If anyone would like to help me out, please take a look. Dylan ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/