Add space between Image blocks
Permalink
Hi there,
I am creating a website and I have div called 'picturebar' which I would like to add 2/3 static images vertically. I have added two and its looking great, but they dont have any space between them and I would like them not to touch. I have added two screen shots of the visual and corresponding css. Any help appreciated.
I am creating a website and I have div called 'picturebar' which I would like to add 2/3 static images vertically. I have added two and its looking great, but they dont have any space between them and I would like them not to touch. I have added two screen shots of the visual and corresponding css. Any help appreciated.
Thanks for the reply. It didn't work unfortunately :-(.
Add padding to the div surrounding the image.
it would really help to see the html (the div and contained images), not just the css
Hi there,
Here is a screenshot of the html when I inspect the element. Hope this helps.
Here is a screenshot of the html when I inspect the element. Hope this helps.
I have managed to do this by editing the block, clicking ' design' and adding a margin. I just wondered if there was a way of coding this into the css so that it would do it automatically. Any ideas greatly appreciated.
Thank you all for you time
Thank you all for you time
Add a div around each image with padding set to half the distance you want between them.
#picturebar img {margin-bottom: 10px;}