spacing - CSS, Picture gallery in a row, space between each picture, -
hello trying add space between pictures in row, in column. here code. appreciate if point me in right direction
<!doctype> <html> <head> <style type="text/css"> body { background-color:#abe9ff; } .container { width: 950px; /* i'm showing 4 images per line */ margin-left: 10px; margin-right: 10px; } .img { /* height: 234px; width: 218px; */ float: left; margin-top: 10px; margin-left: 30px; margin-right: 10px; } </style> <body> <div class="container"> <div img src="interpret_1.png" alt="interpret1" width="218" height="234" href="boywonder.htm"> <img src="interpret_1.png" alt="interpret1" width="218" height="234" href="boywonder.htm"> <img src="interpret_1.png" alt="interpret1" width="218" height="234" href="boywonder.htm"> <img src="interpret_1.png" alt="interpret1" width="218" height="234" href="boywonder.htm"> <img src="interpret_1.png" alt="interpret1" width="218" height="234" href="boywonder.htm"> </body> </html>
use html
<body > <div id="wrapper"> <div class="container"> <img class="image" src="interpret_1.png" alt="interpret1" width="218" height="234" href="boywonder.htm"> <img class="image" src="interpret_1.png" alt="interpret1" width="218" height="234" href="boywonder.htm"> <img class="image" src="interpret_1.png" alt="interpret1" width="218" height="234" href="boywonder.htm"> <img class="image" src="interpret_1.png" alt="interpret1" width="218" height="234" href="boywonder.htm"> <img class="image" src="interpret_1.png" alt="interpret1" width="218" height="234" href="boywonder.htm"> </div> </div> </body>
and css goes like
body{ margin:0 5px; } #wrapper { background-color:#abe9ff; height:500px;} .container { width:950px; margin-left: 10px; margin-right: 10px; } .image{ height: 234px; width: 218px; float: left; margin-top:10px; margin-right: 19px;}
Comments
Post a Comment