Why is my images all on the right? - help please?

[aljames]

My website - www.aljames.co.uk please look at the 'biog' page.

I am having a problem where I insert images but they all appear on the right of the text. I would like some of these to be on the left of the page but cant work out why they are all on the right,.

I am using dreamweaver 2004 mx and when I click on the "Align" button and select left or anything else, it has no effect on the pic placement?

Please can any of you help?

Thanks
Al
p.s. I'm not a real web guru, just a musician who dabbles a bit on DW.

[WhiskyFudge]

Your CSS file css/aj.css contains:

.story img {	
	float: right;
	margin: 0 0 20px 20px;
	padding: 2px;
	border: 1px solid #ccc;
}

You need to change this to:

.story img {	
	float: left;
	margin: 0 0 20px 20px;
	padding: 2px;
	border: 1px solid #ccc;
}

So your basically changing the float from a right float to a left float.

Hope that helps

Jas

[markjanssen]

If you only want one, add style="float: left;" to the image tag.

[aljames]

Thanks guys, I'm nearly there. Now I'm working on my guestbook animated gifs and I cant get the border removed from the gifs - I just want them to be borderless although the other pics on the site I am happy having borders.

Also, I tried the float thing but the images do not completely go to the left (nearly).

Help again please?

Ta

Al

[WhiskyFudge]

Do you want to upload your improvements so we can see the results and problems?

To get rid of the boarder on all your images remove the boarder line in the CSS quote I mentioned above. Other wise you want to add style="border-wdith: 0;" to your image tag, or style="float: left; border-width: 0;" if you want it left as well.

Jas

[aljames]

OK I sorted the pic border fine thanks.

Now, Ive changed the biography page pianobar image as youll see its not quite all the way over to the left.
as Id like it.

Any suggestions?

Cheers

[WhiskyFudge]

Watchin your vid now, you got some talent! anywho:

style="float: left"

needs to become:

style="float: left; margin: 0 20px 20px 0;"

That should do it

[aljames]

That's it! You did it!

Cheers Whisky man, and also for the compliment on my playing.

Al

[WhiskyFudge]

No worries.

[aljames]

strange, my DW MX2004 preview looked perfect but then when I uploaded the newly saved page, it does not look quite the same...

I spoke too soon!

[WhiskyFudge]

It's uploaded as:

style="float: left; margin: 0 px  0;"

Check your code and uplaod again!

Jas

[aljames]

Yes I had removed to '20' bits as I couldnt get rid of the large gap (have a look) at the side and bottom of the text. Any ideas how to reduce these gaps by about half? and also how to create a similar gap at the top of the image?

Really sorry to bother u with this, Im sure your busy enough.

Al

[WhiskyFudge]

the values in margin are top right bottom left. If are want all your margins the same size you only need to write:

margin: 10px;

Hope that helps and makes sense. If you want to learn CSS I suggest you have a look at W3Schools CSS Tutorial . W3Schools also do some good HTML tutorials.

Jas

[aljames]

Cheers mate. THink its sorted now. And you are right I ought to read up and educate myself, there's no excuse!

Respect

Al