Have you checked out the jQuery Masonry plugin? Using it is like having a "float:top" css option, or if you need the images as you described above, then check out this plugin I modified from this post. :)
Edit: Oh oops... no javascript eh? So what exactly are you wanting? It looks like you might have it.
I'm trying to create some sort of recipe for the grid so that it's possible to make the images any height. As for now, a really tall image will mess up the layout.
I would love to have the grid behave like a table. Every row adjusts to the tallest image, and the margins and whitespace stay intact. I was hoping to do this with the markup I'm using right now and no JS, but that may not be possible...
I'm currently designing a portfolio and I would really like the grid of images to kinda look like the image search at Google.
These is what "describes" the grid, and what I'm trying to create:
I would say that I'm pretty damn close. This is what I've got so far: http://kunder.antonniklasson.se/VictoriaCleverby/portfolio.php
I would prefer the markup that I'm using, staying away from ugly tables. And also no javascript if it's possible.
Thanks!
Have you checked out the jQuery Masonry plugin? Using it is like having a "float:top" css option, or if you need the images as you described above, then check out this plugin I modified from this post. :)
Edit: Oh oops... no javascript eh? So what exactly are you wanting? It looks like you might have it.
I'm trying to create some sort of recipe for the grid so that it's possible to make the images any height. As for now, a really tall image will mess up the layout.
I would love to have the grid behave like a table. Every row adjusts to the tallest image, and the margins and whitespace stay intact. I was hoping to do this with the markup I'm using right now and no JS, but that may not be possible...