How do you add spaces between 2 pictures?

How do you add spaces between two pictures. I have a website Google Gift and at the top there are four pictures. Right now I have them spaced with a _
How Do I insert a space inbetween those pictures? I have dreamweaver.

Thanks I know this is probably really simply but I'm just learning

 

Aaarrrhg! My eyes! My eyes!!!!!


Get rid of that background, dude!

 

add a transparent gif image to replace _
you can see an example here: http://hostrindo.com/images/spacer.gif
save as the image and insert it between your images,
you could resize image width as your need

 

You can space them with multiple   which will insert a non-breaking space.
However the better method would be to put the images in a table with its width being equal to the leaderboard below and have four <td> tags, each of whose width equals the total width divided by four.

Hope it helps.

 

Good God that's an ugly site. :LOL:

 

<img src="image.jpg" width="227" height="322" alt="" hspace="20" />
<img src="image.jpg" width="227" height="322" alt="" hspace="20" />
<img src="image.jpg" width="227" height="322" alt="" hspace="20" />

Code (markup):

hspace="20"

But I'd worry about your design before I try putting images above your adsense.

 

A few options.

1. Like the above say, use tables. In the table's <td>, you can specify the width of the <td> to be slightly larger than the image's width.

2. Use hspace in your <img> tag. Form example, <img src="..." hspace="5"> This will put a 5 pixel spacing. Hspace stands for horizontal space.

Cheers.

 

Good God, I think I've seen just about everything in this thread so far that one shouldn't do to space images. Use CSS for that (or to space anything else, for that matter):

<img src="image1.jpg" style="margin-right: 5px;">
<img src="image2.jpg">

Use CSS classes if you need to space multiple images.

J.D.

 

Wow! Forget about spacing images. You really need to brush up on colors:
http://www.colormatters.com/entercolormatters.html

 

Just buy a template lol.

 

You could try using an online color schemer like this one: www.colorschemer.com/online.html

The looks might also improve if you would make the table as wide as the ads, and maybe get rid of the space between them. Also consider taking away the borders or at least making them 1 or 2 px solid color using CSS. And while you're at it, you could add some padding for the table and left align the text to improve readability.

Here's a simple color scheme that should get you in the right direction:
Page background: #cfc2a1
Table background: #fcfcfc
Text outside the table: #45392a
Text inside the table: #222
Links: #ac0605
Titles: #069

Just play with the colors and eventually you'll get it right

Oh, and as for your original question; it's recommended to use CSS to space images, just as J.D. mentioned in his post. The hspace attribute was deprecated in HTML 4.01.

 

Please, please, please do not use spacer gif's, &npsb's or _'s. Use CSS.

With CSS you can set the margins on your image using the margin attribute.

img
{
margin: 10px 10px 10px 10px;
}

that will put a margin of 10 pixels around all images on the page. The order of the values is clockwise from top - top, right, bottom, left. If you want to do something a little more interesting, you could place your image in a <div>, but usually this won't be necessary. You can find out more here: http://www.w3schools.com/default.asp. Good luck!

 

Haha sorry for My ugly site...its just a temporary mock until I have some time to make it look beautiful. I will change the background color

 

Thanks for the great tip, it worked for me.