Re: Really basic float right problem cross browser



On 2009-09-23, dorayme <doraymeRidThis@xxxxxxxxxxxxxxx> wrote:
In article
<45311ca8-1504-48e8-a68c-4aec5d9fb686@xxxxxxxxxxxxxxxxxxxxxxxxxxxx>,
cronoklee <cronoklee@xxxxxxxxxxx> wrote:

Why would you be using transitional as a doctype? What are you
transitioning from, as a well known regular around here likes to say?

The doctype makes no difference as fa as I can tell. Strict and
Transitional produce the same problem. See example below

Lets agree that we all should use a good doctype declaration and be
daring and say it is 4.01 Strict for the moment.

The more logical way to do your above is to
<div style="float:right">floated right!</div>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>...


Yes I mentioned placing the float before the inline my post but I'd
prefer a CSS solution. Floated right content should appear beneath
main content when CSS is off.


As mentioned, if you put the floated element to the right of mere inline
content and the latter is lots that wrap to a few lines, you might not
get the float appearing quite where you want it in vertical space. Let's
see below...



Well, for one thing that's invalid markup so it might not be so
surprising that it renders differently in different browsers. Inline
content cannot be contained in the <body> "naked"; it must be nested in
a block element.


OK well imagine I originally posted this then:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/
TR/html4/strict.dtd"><html>
<head>
<title>test</title>
</head>
<body>
<span>Some inline content<span><div style="float:right">floated right!
</div>
</body>
</html>


Let's close your SPAN. But even so, this does not get over the point you
are responding to because SPAN itself is an inline element.

I would be rid of span and use a paragraph element. But, for the point I
make now, it will make no difference, either! If you style the P or the
SPAN with style="float: left;", you should see what you want to see in
the recalcitrant browsers and have the right float text appear under the
left if CSS is off.

Is this a "CSS solution" that you wanted?

Why is there such a difference in browsers in your original case? Ask
Microsoft, they produced buggy browsers because they were careless and
too much on their minds at the time. Getting them to reasonable
standards has been a bit like getting North Korea to give up nuclear
weapon capability.

This was actually a bug-in-common between Firefox and IE. I think the
correct CSS rules are unnecessarily silly in this case and the spec
should have been changed to what FF and IE were doing.

But rules are rules. Opera and Konqueror and the most recent FF get it
right.
.



Relevant Pages

  • Re: Help with HTML Programming Issues
    ... There is no *indexed* mention for BR in the CSS 2.1 specs I have. ... and Annex 14 which browsers don't have to follow ... But, regardless of that, you _must_ get empty lines for consecutive BRs ... A BR is an inline ...
    (comp.infosystems.www.authoring.html)
  • Re: Firefox: correct xhtml DOCTYPE tag breaks script?
    ... Mozilla/Gecko browsers have a problem. ... positions are calculated and html 4.01 strict is used. ... The only likely issue with using non-integers with CSS assignments would ... the DOCTYPE processing instruction. ...
    (comp.lang.javascript)
  • Re: Suggestions and help please
    ... decided it was time for me to take the plunge and make it strict with CSS ... really moot as long as it appears correctly in the vast MAJORITY of ... break in the Majority of your visitors's browsers? ...
    (alt.html)
  • Re: making a bottom margin
    ... >> Not defining a width for floated elements is bad form, CSS 2.0 compliant ... >> browsers should also be catered for. ... Does "inline content" mean elements ...
    (comp.infosystems.www.authoring.stylesheets)
  • Re: CSS?
    ... > I disagree that a browser loads a CSS page faster than a standard HTML ... Check my site and measure the load time. ... With regard to older browsers, if you are worried about NN2 and IE2, then ...
    (microsoft.public.frontpage.client)