Help with H3 element floating in the wrong place

**Jonathan N. Little** · Sep 18 '07, 04:55 PM

Re: Help with H3 element floating in the wrong place

..... www.FocusOnPanama.com .... wrote:

I have an annoying problem with the site I am developing. This is how I see
the problem appear:
>
In a paragraph (<P>) I start with an IMG tag that has an 'align=left' OR
'align=right' (with the proper quoting of course). The validator complains
that 'align' is not a proper XHTML attribute but I have not seen a suitable
CSS alternative that works comparatively well.

"float"?

try float: left; or float: right;

>
Then after that paragraph there is a heading (H1/H2/H3/H4) element with
background and there is the problem:
>
1. On FireFox the paragraph flows nicely on the side (left or right) of the
image (<img align='xxx'/>) but then if the paragraph is not long enough the
following H* element will display as if it was behind the image rather than
AFTER the image.

Now look up "clear"

clear: left; or clear: right; or clear: both;

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO

Little Works Studio Site Maintainance

http://www.LittleWorksStudio.com

**.... www.FocusOnPanama.com ....** · Sep 18 '07, 05:35 PM

Re: Help with H3 element floating in the wrong place

Thanks, that does it indeed. I was using the br clear before but now I
stayed away from it because it keeps complaining that it is not valid XHTML
but then again, CSS does not appear to offer any alternative to not
using it, go figure!. So I am just now plugging in the <br clear="..."/tag
there.

Same thing goes for <div align="center"i t says it is not proper XHTML
Transitional but then I could not find any good CSS alternative that did not
have some side effect or one browser or the other.

Emilio

"Jonathan N. Little" <lws4art@centra lva.netwrote in message
news:daa46$46f0 012d$40cba7b7$2 8179@NAXS.COM.. .

.... www.FocusOnPanama.com .... wrote:

>I have an annoying problem with the site I am developing. This is how I
>see the problem appear:
>>
>In a paragraph (<P>) I start with an IMG tag that has an 'align=left' OR
>'align=right ' (with the proper quoting of course). The validator
>complains that 'align' is not a proper XHTML attribute but I have not
>seen a suitable CSS alternative that works comparatively well.

>
"float"?
>
try float: left; or float: right;
>
>

>>
>Then after that paragraph there is a heading (H1/H2/H3/H4) element with
>background and there is the problem:
>>
>1. On FireFox the paragraph flows nicely on the side (left or right) of
>the image (<img align='xxx'/>) but then if the paragraph is not long
>enough the following H* element will display as if it was behind the
>image rather than AFTER the image.

>
Now look up "clear"
>
clear: left; or clear: right; or clear: both;
>
>
--
Take care,
>
Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

**Jonathan N. Little** · Sep 18 '07, 06:35 PM

Re: Help with H3 element floating in the wrong place

..... www.FocusOnPanama.com .... wrote:

## Don't top-post please ##

Thanks, that does it indeed. I was using the br clear before but now I
stayed away from it because it keeps complaining that it is not valid XHTML

You do not appear to understand nor need *xhtml*. Do yourself a favor
and abandon it and use html 4.01 strict.

but then again, CSS does not appear to offer any alternative to not
using it, go figure!. So I am just now plugging in the <br clear="..."/tag
there.

No, your should not use deprecated html attributes "align" and "clear"
etc, but in your stylesheet define

div { /* whatever */}
..someClass { /* whatever */ }
#someID {/* whatever */ }

>
Same thing goes for <div align="center"i t says it is not proper XHTML
Transitional but then I could not find any good CSS alternative that did not
have some side effect or one browser or the other.

div { width: 80%; margin: 0 auto; }

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO

Little Works Studio Site Maintainance

http://www.LittleWorksStudio.com

**Beauregard T. Shagnasty** · Sep 18 '07, 06:45 PM

Re: Help with H3 element floating in the wrong place

..... www.FocusOnPanama.com .... wrote:

Thanks, that does it indeed. I was using the br clear before but now I
stayed away from it because it keeps complaining that it is not valid
XHTML but then again, CSS does not appear to offer any alternative to
not using it, go figure!. So I am just now plugging in the <br
clear="..."/tag there.

..clear { clear: both; } (or left, or right)

Same thing goes for <div align="center"i t says it is not proper
XHTML Transitional but then I could not find any good CSS alternative
that did not have some side effect or one browser or the other.

div.cent { text-align: center; }

<div class="cent">Th is will be centered.</div>

Please don't top-post. Thanks for your consideration.

--
-bts
-Motorcycles defy gravity; cars just suck

**Jonathan N. Little** · Sep 18 '07, 06:55 PM

Re: Help with H3 element floating in the wrong place

Jonathan N. Little wrote:

.... www.FocusOnPanama.com .... wrote:

>>
>Same thing goes for <div align="center"i t says it is not proper
>XHTML Transitional but then I could not find any good CSS alternative
>that did not have some side effect or one browser or the other.

>
div { width: 80%; margin: 0 auto; }

Oops, fingers before brain... <div align="center"m eans center aligned
text, been awhile!

Try

div { text-align: center; }

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO

Little Works Studio Site Maintainance

http://www.LittleWorksStudio.com

**Ben C** · Sep 18 '07, 08:55 PM

Re: Help with H3 element floating in the wrong place

On 2007-09-18, .... www.FocusOnPanama.com .... <fightspam@mail box.nowwrote:

Thanks, that does it indeed. I was using the br clear before but now I
stayed away from it because it keeps complaining that it is not valid XHTML
but then again, CSS does not appear to offer any alternative to not
using it, go figure!. So I am just now plugging in the <br clear="..."/tag
there.
>
Same thing goes for <div align="center"i t says it is not proper XHTML
Transitional but then I could not find any good CSS alternative that did not
have some side effect or one browser or the other.

There are CSS alternatives for both those things and others. See
http://www.cs.tut.fi/~jkorpela/html2css.html for a list.

**Bergamot** · Sep 18 '07, 10:35 PM

Re: Help with H3 element floating in the wrong place

Beauregard T. Shagnasty wrote:

>
font-family: "Bodoni MT Black", "Bookman Old Style", "Comic Sans MS",
Verdana, Arial;
>
(not that I would pick those. How many visitors will have Bodoni MT
Black installed on their computers?)

More importantly, how many visitors will go blind or insane if they have
to look at Comic Sans?

That's the mark of a true amateur. :)

--
Berg

**Beauregard T. Shagnasty** · Sep 18 '07, 11:25 PM

Re: Help with H3 element floating in the wrong place

Bergamot wrote:

Beauregard T. Shagnasty wrote:

>>
>font-family: "Bodoni MT Black", "Bookman Old Style", "Comic Sans MS",
>Verdana, Arial;
>>
>(not that I would pick those. How many visitors will have Bodoni MT
>Black installed on their computers?)

>
More importantly, how many visitors will go blind or insane if they
have to look at Comic Sans?

Looking up Bodoni, it seems to be a half-bold (how to describe? - fat on
one side, skinny on the other) serif font. I was wondering more about
that than the Comic Sans.

404 Not Found | MyFonts

http://www.myfonts.com/fonts/agfa/bodoni-mt/

That's the mark of a true amateur. :)

F.O.P. has two serif, one 'casual', and two sans-serif, but no fallback.
Heh, Comic Sans was designed for the word balloons in Microsoft Bob!

--
-bts
-Motorcycles defy gravity; cars just suck

**Jonathan N. Little** · Sep 19 '07, 01:55 AM

Re: Help with H3 element floating in the wrong place

Joshua Cranmer wrote:

Jonathan N. Little wrote:

>Aw! What's wrong with Bob! Don't you just love it when MS tries to be
>cute!
>>

>
Like Clippit?
>
My teacher uses Comic Sans... Georgia looks so much better to me.
>

http://www.littleworksstudio.com/temp/usenet/ByeByeClippy.jpg

ByeByeClippy.jp g (JPEG Image, 149x136 pixels)

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO

Little Works Studio Site Maintainance

http://www.LittleWorksStudio.com

**.... www.FocusOnPanama.com ....** · Sep 19 '07, 07:15 AM

Re: Help with H3 element floating in the wrong place

"Bergamot" <bergamot@visi. comwrote in message
news:5lb1kiF7dp pcU1@mid.indivi dual.net...

More importantly, how many visitors will go blind or insane if they have
to look at Comic Sans?
>
That's the mark of a true amateur. :)
>

That comment is just nasty and does not offer any solution so I will choose
to ignore it ;-) and why? because Comic Sans ONLY appears together with
Bodoni in the CSS and then ONLY for special headings such ash H1..H4 and
table section headings and NOT paragraphs. It would help not to jump to
conclusions without getting the facts ;-) I am not a font expert that is for
sure and like I said in the original post at this test point I had not yet
concerned myself with the fonts, basically just the layout and the technical
stuff behind the site.

**.... www.FocusOnPanama.com ....** · Sep 19 '07, 07:35 AM

Re: Help with H3 element floating in the wrong place

No problem Jonathan :) the thing is my text is invariably left aligned. The
only times I use the <div align="center"i s when I want to center a box
within the alloted space. For example having a TABLE horizontally centered
on the screen (rather than sticking to the left) or as in most of the cases
horizontally centering an IMG element such as a banner or an image in
between text paragraphs.

When I attempted that text-align: center I did not produce the correct
results. That is what someone had suggested before in some other place but
did not work as desired.

Any other ideas?

"Jonathan N. Little" <lws4art@centra lva.netwrote in message
news:79e20$46f0 1d65$40cba7b7$4 266@NAXS.COM...

Jonathan N. Little wrote:

>.... www.FocusOnPanama.com .... wrote:

>

>>>
>>Same thing goes for <div align="center"i t says it is not proper XHTML
>>Transitiona l but then I could not find any good CSS alternative that did
>>not have some side effect or one browser or the other.

>>
>div { width: 80%; margin: 0 auto; }

>
Oops, fingers before brain... <div align="center"m eans center aligned
text, been awhile!
>
Try
>
div { text-align: center; }
>
--
Take care,
>
Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

**.... www.FocusOnPanama.com ....** · Sep 19 '07, 07:45 AM

Re: Help with H3 element floating in the wrong place

That is a great link, thanks.

"Ben C" <spamspam@spam. eggswrote in message
news:slrnff0ei7 .3gu.spamspam@b owser.marioworl d...

>There are CSS alternatives for both those things and others. See

http://www.cs.tut.fi/~jkorpela/html2css.html for a list.

**Jonathan N. Little** · Sep 19 '07, 02:25 PM

Re: Help with H3 element floating in the wrong place

..... www.FocusOnPanama.com .... wrote:

Hey Focus, please do not top post, it get very confusing after a few
replies. I if "fix" your posting here...

>Jonathan N. Little wrote:

>>.... www.FocusOnPanama.com .... wrote:
>>>Same thing goes for <div align="center"i t says it is not proper

XHTML

>>>Transition al but then I could not find any good CSS alternative

that did

>>>not have some side effect or one browser or the other.
>>div { width: 80%; margin: 0 auto; }

>Oops, fingers before brain... <div align="center"m eans center

aligned

>text, been awhile!
>>
>Try
>>
>div { text-align: center; }
>>

No problem Jonathan :) the thing is my text is invariably left aligned. The
only times I use the <div align="center"i s when I want to center a box
within the alloted space. For example having a TABLE horizontally centered
on the screen (rather than sticking to the left) or as in most of the cases
horizontally centering an IMG element such as a banner or an image in
between text paragraphs.
>
When I attempted that text-align: center I did not produce the correct
results. That is what someone had suggested before in some other place but
did not work as desired.

Yes, then my original post was what your want. it is margins on the
*block element* not text-align. Note that by default an image is inline
not block. For this to work the block element must have a defined width
and then your set the left and right margins to auto. Examples, well my
first would works for a DIV

div { width: 80%; margin: 0 auto; }

for an image you must change it to display as block.

img { display: block; margin-left: auto; margin-right: auto; }

Now another posting on Usenet 101 lesson, since you are using Outlook
Express that is notorious for top-posting and not removing signatures
you may have to manually do this. You should remove signatures from your
replies, the bit after the "-- " below...

>--
>Take care,
>>
>Jonathan
>-------------------
>LITTLE WORKS STUDIO
>http://www.LittleWorksStudio.com

>
>

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO

Little Works Studio Site Maintainance

http://www.LittleWorksStudio.com

Help with H3 element floating in the wrong place

Help with H3 element floating in the wrong place

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment