rows of thumbs
in [CSS]
|
Prev: How to center nested divs
Next: Multiple CSS Classes
From: Jeff on 5 May 2008 19:30 dorayme wrote: > In article <v5SdnYsB85mA2ILVnZ2dnUVZ_i2dnZ2d(a)earthlink.com>, > Jeff <jeff(a)spam_me_not.com> wrote: > >> I'd like to revisit an old irritant of mine and see if there any new >> ideas. >> >> Rows of "thumbs", typically an image and some text, perhaps a form, >> wrapped in a div. >> >> If you float left everthing, when the row wraps the next row starts >> at the lowest block for the previous row. This gives a very displeasing >> staggered look. >> > > You can manage things by at least sorting landscapes from portraits to > give you a head start. In the end, you either do a bit of sorting to > keep like with like re height or buy the consequences about some > symmetry untidiness. I prefer sorting and short captions (if the latter > at all). > > <http://tinyurl.com/2jcs5r> Trouble is this stuff is typically database drive, then you usually don't know what is going to be where. Say you change the sort or the search. This sort of layout is really common for shopping pages. You never know either the orientation of the product thumbnail image, or the length of the description. I think I may write a bit of javascript to retro fix this. My equal height javascript code will reset bottom padding so that all blocks are the same height. Of course that will do it for all blocks. What I'm thinking of now is to do this one "row" at a time. I think that is cleaner than throwing in js created clearing blocks. BTW, I think you are the only one here that would be interested, but I had my first and probably only photo show at a local 503C (non profit) Gallery. Nobody ever sells anything at these places but I sold 23 items. I've been working on this for months... Jeff > |