How to put a 15 px space between two pictures using div tags and CSS?

I have to put three pictures on my website with 15 px in between each picture. I have to use div taghs and CSS to do this. I have searched all over and cannot figure out how to do it. I am using Dreamweaver by the way.

How to put a 15 px space between two pictures using div tags and CSS?
If you want to add a margin to any element in HTML you can just set the margin style to a pixel value. For example:


%26lt;img src=%26quot;youimg.jpg%26quot; style=%26quot;margin-right:15px;%26quot; /%26gt;





this will add a 15px right margin on your image. There are also properties margin-top, margin-bottom and margin-left to add margins on those sides of an element. This is an excellent intro/tutorial to CSS, http://www.w3schools.com/css/default.asp
Reply:Dreamweaver is irrelevant, except to say you have to go to the code window to do this.





It%26#039;s code you are talking about. To be honest, easier in a standard HTML editor, or even notepad, than a hulking great frontend that tries to take over.





Anyway. Put this in the area between %26lt;head%26gt; and %26lt;/head%26gt; somewhere (or just add the bit about the img to your existing stylesheet)





%26lt;style type=%26quot;text/css%26quot;%26gt;


img {


margin-right: 15px;


}


%26lt;/style%26gt;





In the bit between %26lt;body%26gt; and %26lt;/body%26gt;, where you want it to appear, put this:





%26lt;div%26gt;


%26lt;img src=%26quot;1stimage.ext%26quot; alt=%26quot;description%26quot;%26gt;


%26lt;img src=%26quot;2ndimage.ext%26quot; alt=%26quot;description%26quot;%26gt;


%26lt;img src=%26quot;3rdimage.ext%26quot; alt=%26quot;description%26quot;%26gt;


%26lt;/div%26gt;





Could it be much easier?





You would be well advised to stop using Dreamweaver as a learning tool. It is not a learning tool. It is a production tool. It will most likely hinder you if you are learning code, as you will try to use it as a shortcut and it is very much not that.
Reply:You could simply add hspace (horizontal space) to the middle image. It would add 15 px on the left and the right of that one image, thus giving you the spacing you desire. Not CSS, but easy.





%26lt;img src=%26quot;pic.gif%26quot; hspace=%26quot;15%26quot;%26gt;





To do this with CSS you could add an inline style to the middle image like this-





%26lt;img src=%26quot;pic.gif%26quot;


style=%26quot;padding-left:15px%26quot;;


padding-right:15px%26quot;%26gt;





or create a custom class with those CSS definitions. Lots of ways to do this.





Joyce


http://www.DesignByJoyce.com/



health care