问题
Imhaving a bit of difficulty with CSS styling on my website, Currently I have a row of images that I'd like to align horizontally along my page. But just now it displays them all vertically in a row and I'm not sure why. All the images are stored in an array, it's just getting them lined up that's the problem. here is my code:
.img{
float:left;
width:120px;
margin:auto;
margin-left:10px;
padding:5px;
}
回答1:
You should add the to your style display:inline-block
. The inline-block
value makes, that your .img is not displayed with a new-line at the end.
回答2:
Images by default are display: inline
. This means they will not clear other elements horizontally by default IF there is space in their container. Adjust the width of the parent container of the image elements: example
If you want your images to expand horizontally irrespective of container width, use display: table-cell
in the style (css) in a div wrapping each image element: example
来源:https://stackoverflow.com/questions/15999421/displaying-images-horizontally-css