I'm trying to center an image and some text inside a list item to make a gallery. text-align:ceneter; centers the text as one would expect, but I can't think how to center the images as well. Anyone know the awnser?
Here's more of the code I'm using, it's on this page (<!-- m --><a class="postlink" href="http://cherryblossomart.ntwebsite.net/gallery.php">http://cherryblossomart.ntwebsite.net/gallery.php</a><!-- m -->).ul#gallery{padding: 0;}
ul#gallery li{
list-style-type: none;
float: left;
border: 1px solid;
margin: 10px;
padding: 5px;
text-align: center;
}
ul#gallery img{
display: block;
border: 0px;
}ul#gallery img{
margin:auto;
display: block;
border: 0px;
}Thanks
to be honest I don't get why that works, but it seems to so I'll take it auto expands the margins to the edges of the parent container.
and now the issues with the layout in all other browsers ...
Here's more of the code I'm using, it's on this page (<!-- m --><a class="postlink" href="http://cherryblossomart.ntwebsite.net/gallery.php">http://cherryblossomart.ntwebsite.net/gallery.php</a><!-- m -->).ul#gallery{padding: 0;}
ul#gallery li{
list-style-type: none;
float: left;
border: 1px solid;
margin: 10px;
padding: 5px;
text-align: center;
}
ul#gallery img{
display: block;
border: 0px;
}ul#gallery img{
margin:auto;
display: block;
border: 0px;
}Thanks
to be honest I don't get why that works, but it seems to so I'll take it auto expands the margins to the edges of the parent container.and now the issues with the layout in all other browsers ...