firstrebel Posted May 1, 2015 Share Posted May 1, 2015 I have used the CSS from this W3School page to create an image gallery: http://www.w3schools.com/css/css_image_gallery.asp It works OK until you reduce the screen size to that of a mobile in landscape layout. The images no longer follow each other in a regular pattern, and gaps appear. This appearance is random on different mobiles. Bob Link to comment Share on other sites More sharing options...
dsonesuk Posted May 2, 2015 Share Posted May 2, 2015 Your images are of different heights 175px to 177px a higher image within a row where the sibling images are of lower height, causes floated image below it to butt against the 2px protruding bottom/right edge of the 177px high image above it. try max-height: 175px; to make them of equal height; Link to comment Share on other sites More sharing options...
firstrebel Posted May 3, 2015 Author Share Posted May 3, 2015 I thought that may have been the issue. I tried your suggestion and got this: So I decided the easiest was to make them all the same size. As they are thumbs the small change does not show. Many thanks. Bob Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now