Replacing an align tag inside of <img using CSS

Hi,

Probably a dumb question, but I have a lot of align="left"s on my Happy
Tree Friends page.

i.e. lots of

<img class="image" src="/images/fluffy.png" width="90" height="90"
align="left" alt="Fluffy, the wobbly dragon" />

Is there a way I can say align="left" within CSS. I know there is a
text-align property, but not an image align. The stylesheet already has
a float:left (or float:right) within the image class structure.

Can it be done?

TTFN

Paul

Paul F. Johnson

On Tue, 12 Oct 2004 15:34:26 +0100, Paul F. Johnson
<> wrote:

> Hi,
>
> Probably a dumb question, but I have a lot of align="left"s on my Happy
> Tree Friends page.
>
> i.e. lots of
>
> <img class="image" src="/images/fluffy.png" width="90" height="90"
> align="left" alt="Fluffy, the wobbly dragon" />
>
> Is there a way I can say align="left" within CSS. I know there is a
> text-align property, but not an image align. The stylesheet already has
> a float:left (or float:right) within the image class structure.
>
> Can it be done?
>

text-align will work fine. It's actually misnamed, it ought to be
content-align.

On Tue, 12 Oct 2004 15:59:43 +0100, Spartanicus <> wrote:

> Neal <> wrote:
>
>> text-align will work fine. It's actually misnamed, it ought to be
>> content-align.
>
> Nah, confusion galore about it centering non inline stuff.

inline-align, anyone?

Neal <> wrote:

>text-align will work fine. It's actually misnamed, it ought to be
>content-align.

Nah, confusion galore about it centering non inline stuff.

--
Spartanicus

In alt.html Neal said:

>>> text-align will work fine. It's actually misnamed, it ought to be
>>> content-align.

>> Nah, confusion galore about it centering non inline stuff.

> inline-align, anyone?

too hard to say when drunk. inlnaln just doesn't work.


--


v o i c e s

Neal <> wrote:

>> Is there a way I can say align="left" within CSS. I know there is a
>> text-align property, but not an image align. The stylesheet already
>> has a float:left (or float:right) within the image class structure.
>>
>> Can it be done?
>
> text-align will work fine. It's actually misnamed, it ought to be
> content-align.

Will it? By definition, text-align applies to block elements only (hence
not to img elements unless you set the display property), and it affects
the alignment of each line.

Using the float property is the way to replace the align attribute,
should someone want to do that. (I would advice against rewriting working
code to clean it up, but suum cuique.) If this does not work for some
page, we need the URL for analysis.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html

"Jukka K. Korpela" <> wrote:

>By definition, text-align applies to block elements only (hence
>not to img elements unless you set the display property)

Wrong way 'round.

>Using the float property is the way to replace the align attribute,

Using float only to align is an ugly hack, sometimes a necessary evil
but not something that should be propagated as a generic method of
alignment.

--
Spartanicus

Spartanicus <> wrote:

>"Jukka K. Korpela" <> wrote:
>
>>By definition, text-align applies to block elements only (hence
>>not to img elements unless you set the display property)
>
>Wrong way 'round.

Umm, on reflection I assume you meant to say that text-align can be
specified on block level elements only (I was thrown by the "not to img
elements" bit which makes no sense since the img element is empty).

--
Spartanicus

Spartanicus <> wrote:

>>>By definition, text-align applies to block elements only (hence not
>>>to img elements unless you set the display property)
>>
>>Wrong way 'round.
>
> Umm, on reflection I assume you meant to say that text-align can be
> specified on block level elements only

No, I meant exactly what I wrote. You can _specify_ any property for any
element (e.g. img { text-align: left; ]), but by definition some
properties _apply_ (i.e., may have an observable effect on rendering) to
some elements only.

> (I was thrown by the "not to img
> elements" bit which makes no sense since the img element is empty).

It makes perfect sense. The img element is not a block element (unless
you explicitly set its display property). That's all that matters here.
But for the record: Emptyness is a matter of HTML syntax, not CSS. The
img element is (by default) a replaced inline element in CSS.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html

On Tue, 12 Oct 2004 18:55:00 +0000 (UTC), Jukka K. Korpela
<> wrote:

> Spartanicus <> wrote:
>
>>>> By definition, text-align applies to block elements only (hence not
>>>> to img elements unless you set the display property)
>>>
>>> Wrong way 'round.
>>
>> Umm, on reflection I assume you meant to say that text-align can be
>> specified on block level elements only
>
> No, I meant exactly what I wrote. You can _specify_ any property for any
> element (e.g. img { text-align: left; ]), but by definition some
> properties _apply_ (i.e., may have an observable effect on rendering) to
> some elements only.

You got me backwards. I wasn't suggesting we put text-align on the img
element, but on its container.

Agreed, though, that plenty of times float is better. But text-align
applied to an ancestor element will affect image positioning.