Velocity Reviews

Velocity Reviews (http://www.velocityreviews.com/forums/index.php)
-   HTML (http://www.velocityreviews.com/forums/f31-html.html)
-   -   Image centering (http://www.velocityreviews.com/forums/t160184-image-centering.html)

SamuŽl van Laere 12-05-2004 02:10 PM

Image centering
 
Good afterneun,

I use some inline styling on a image and its paragraf tag:
<p style="text-align: center; margin: 1em">
<img style="text-align: center; margin: 1em" src="jesouk.jpg" width="500"
height="346" alt="Some alt text">
</p>

Now this centers the image on IE, FF, MZ, NS and OP
Though i'm not sure if both the paragraf and image tags need to be styled.
Anyhow, I figured that it would be better to make a class and call it like
this:

<p class="centered">
<img class="centered" src="http://www.oukje.nl/afbeeldingen/jesouk.jpg"
width="500" height="346" alt="
Foto van geleidehond Oukje in functie met haar vrouwtje Jessica"></p>

This being the class:
..centered { margin: 1em; text-align: center; }

But nope it won't center the image when done like that.
Is there anything missing that causes the image not to center?
Same stylerules inline do work, confusing to say the least.

Sure i've got a URL, but it only shows the inline style in action.


Regards,
SamuŽl van Laere
the Netherlands



Peter 12-05-2004 03:39 PM

Re: Image centering
 
SamuŽl van Laere wrote:

>Good afterneun,
>
>I use some inline styling on a image and its paragraf tag:
> <p style="text-align: center; margin: 1em">
><img style="text-align: center; margin: 1em" src="jesouk.jpg" width="500"
>height="346" alt="Some alt text">
></p>
>
>Now this centers the image on IE, FF, MZ, NS and OP
>Though i'm not sure if both the paragraf and image tags need to be styled.
>Anyhow, I figured that it would be better to make a class and call it like
>this:
>
><p class="centered">
><img class="centered" src="http://www.oukje.nl/afbeeldingen/jesouk.jpg"
>width="500" height="346" alt="
>Foto van geleidehond Oukje in functie met haar vrouwtje Jessica"></p>
>
>This being the class:
>.centered { margin: 1em; text-align: center; }
>
>But nope it won't center the image when done like that.
>Is there anything missing that causes the image not to center?
>Same stylerules inline do work, confusing to say the least.
>
>Sure i've got a URL, but it only shows the inline style in action.
>
>
>Regards,
>SamuŽl van Laere
>the Netherlands
>
>
>
>

I changed this:
<div align="center"><img
src="http://www.oukje.nl/afbeeldingen/jesouk.jpg" width="500"
height="346" alt="
Foto van geleidehond Oukje in functie met haar vrouwtje Jessica"></div>

Centers perfectly
Peter

SamuŽl van Laere 12-05-2004 06:11 PM

Re: Image centering
 
"Peter" <pjmsmit@wanadoo.nl> wrote in message
news:41b32bc0$0$45966$a344fe98@news.wanadoo.nl...
>
> I changed this:
> <div align="center"><img
> src="http://www.oukje.nl/afbeeldingen/jesouk.jpg" width="500"
> height="346" alt="
> Foto van geleidehond Oukje in functie met haar vrouwtje Jessica"></div>
>
>


Thanks Peter.
To bad it requires a div though, but its probally allright to use it for
images.

Regards,
SamuŽl



David Dorward 12-05-2004 07:04 PM

Re: Image centering
 
SamuŽl van Laere wrote:

> I use some inline styling on a image and its paragraf tag:
> <p style="text-align: center; margin: 1em">
> <img style="text-align: center; margin: 1em" src="jesouk.jpg" width="500"
> height="346" alt="Some alt text">
> </p>


The text-align property on the img is pointless. Text align applies to block
elements and centres the inline content of that block. Images are inline.

> Anyhow, I figured that it would be better to make a class and call it like
> this:
>
> <p class="centered">
> <img class="centered" src="http://www.oukje.nl/afbeeldingen/jesouk.jpg"
> width="500" height="346" alt="
> Foto van geleidehond Oukje in functie met haar vrouwtje Jessica"></p>
>
> This being the class:
> .centered { margin: 1em; text-align: center; }


That isn't a class. "centered" is a class. That is a style using a class
selector.

> But nope it won't center the image when done like that.


It should do. The reason it doesn't is most likely due to code you aren't
showing us. Try providing a URL in future. Code fragments can make it
easier to find the relevant portion, but are not always enough on their
own.

--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Home is where the ~/.bashrc is

David Dorward 12-05-2004 07:04 PM

Re: Image centering
 
Peter wrote:


> <div align="center">


Deprecated; should not be used.


--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Home is where the ~/.bashrc is


All times are GMT. The time now is 05:11 AM.

Powered by vBulletin®. Copyright ©2000 - 2014, vBulletin Solutions, Inc.
SEO by vBSEO ©2010, Crawlability, Inc.