Image Align

[Graeme]

Hello All,

 

Can anyone tell me why the image on the right of this page will not align in the centre of the right column?

 

http://www.btinternet.com/~gj.d/2bfit/aboutus.html

 

I used 2

 

.imgholder

 

and

 

.imgholder_centre

 

Thank you as always,

 

Best wishes

Graeme

[falkencreative]

I'm not seeing any CSS styles defined for ".imgholder_centre". You would need to add that to your stylesheet.

[Graeme]

Hello,

 

Thank you.

 

I have

 

.imgholder_centre {

padding: 0px;

margin: 5px;

border: 1px dotted #;

background-color: #FFF;

float: middle;

 

and

 

.imgholder {

padding: 0px;

margin: 5px;

border: 1px dotted #;

background-color: #FFF;

float: right;

 

Thanks for your help,

 

Best wishes

Graeme

[Andrea]

Add a text-align: center; to your #rightbar.

 

And while you have .imgholder in your CSS, there isn't one in your HTML.

 

There is no such thing as a float: middle (or center).

[Graeme]

Thanks Andrea,

 

It's just what I want now. Incidently, I had

 

<div class="imgholder_centre">

<img src="images/fitness.jpg" width="120" height="153" alt="" />

</div>

in my HTML!

 

Best wishes

Graeme

[Andrea]

Yes, you have imgholder_center, but that is NOT the same as imgholder. You had no imgholder (didn't look if there's one there now)

[Graeme]

Should I just use an Image tag and not use any imgholder_center, or image holder?

[Andrea]

This is the HTML you have for that section of your page:

<div id="rightbar">

	<div class="imgholder">
		<img src="[url="view-source:http://www.btinternet.com/%7Egj.d/2bfit/images/fitness.jpg"]images/fitness.jpg[/url]" width="120" height="153" alt="" />
	</div>

	<!-- <h2>latest news</h2>
	<p><span class="orangetext">March 2011</span><br />
         Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Utid anisl nec leo congue fringilla. <br />
         <br /> -->
     </div>

and in your CSS, your using #rightbar to format the content of that div. You don't need the #imgholder you have, nor the imgholder_center you don't have. (Just delete those 2 sections in your CSS and note that nothing at all happens.)

[Graeme]

Thanks Andrea, but surely I still need a Div for the image.

 

Graeme

[Andrea]

Why? - Delete it and see what happens.

[Graeme]

So should I just use a standard image tag for the image?

[Andrea]

You should always just use the minimum of division that you need - looking through your code, there are probably a few more that are redundant. In this case, if you remove the div around your image, it actually truly centers. If you need to specifically target this image, you can always and an ID or class to the img tag itself.

[Graeme]

Thanks, thanks and thanks again.

 

Best wishes

Graeme