What ways can I put images in a grid-like format?

Posted by Peter on Stack Overflow See other posts from Stack Overflow or by Peter
Published on 2010-04-01T18:36:22Z Indexed on 2010/04/01 18:43 UTC
Read the original article Hit count: 316

Filed under:

grid

|

images

|

html

|

css

I have about 12-15 images that I want to align together in a grid, with text under each image. I thought about using a table, but I hear that tables aren't the best way to go these days. I tried a few other things, but nothing seemed to work the way I wanted it to.

An example of what I want it to look like would be something like this:

[-----Image-----] [-----Image-----] [-----Image-----] [-----Image-----] --- Row 1

(--Description-) (-Description-) (-Description-) (-Description-)

[-----Image-----] [-----Image-----] [-----Image-----] [-----Image-----] --- Row 2

(--Description-) (-Description-) (-Description-) (-Description-)

and so on...

What are some other methods, besides tables, that I should look into using? Any suggestions or references would be helpful.

© Stack Overflow or respective owner

Related posts about grid

Metro: Introduction to CSS 3 Grid Layout

as seen on Stephen Walter - Search for 'Stephen Walter'
The purpose of this blog post is to provide you with a quick introduction to the new W3C CSS 3 Grid Layout standard. You can use CSS Grid Layout in Metro style applications written with JavaScript to lay out the content of an HTML page. CSS Grid Layout provides you with all of the benefits of using… >>> More
Metro: Introduction to CSS 3 Grid Layout

as seen on Stephen Walter - Search for 'Stephen Walter'
The purpose of this blog post is to provide you with a quick introduction to the new W3C CSS 3 Grid Layout standard. You can use CSS Grid Layout in Metro style applications written with JavaScript to lay out the content of an HTML page. CSS Grid Layout provides you with all of the benefits of using… >>> More
Scroll Viewer not visible in wpf DataGrid

as seen on Stack Overflow - Search for 'Stack Overflow'
I have a datagrid in a grid but the scrollviewer is not visibile even though I made it auto. Below in my code. I can't figure out where's the problem. <Grid Grid.Row="0" Grid.Column="0"> <Grid.RowDefinitions> … >>> More
Am I going about this the right way?

as seen on Stack Overflow - Search for 'Stack Overflow'
Hey Guys, I'm starting a WPF project, and just finished the base of the UI, it seems very convoluted though, so I'm not sure if I've gone around laying it out in the right way. I don't want to get to start developing the back-end and realise that I've done the front wrong, and make life harder for… >>> More
Visibility.Collapse doesnt work

as seen on Stack Overflow - Search for 'Stack Overflow'
Visibility.Collapse doesnt work in my case. below is the XAML. If i try to hide the lblCountry and cmbCountry a white space is shown between zip and practice fields. There is no option to hide an entire row of a Grid. <Grid> <Canvas Name="canDemographic" > </Canvas> … >>> More

Related posts about images

Removing duplicate images (deduplication) - calculating "overlap" of images

as seen on Server Fault - Search for 'Server Fault'
Hello, I have a ton of product images on our file system. Our code removes 100% identical images (or does not allow them to be uploaded). However our sellers often upload items pictures which are very similar, but not exactly. They could have more whitespace, a worse quality (compression), a different… >>> More
How can I center XHTML content with CSS?

as seen on Stack Overflow - Search for 'Stack Overflow'
so I recently converted a website of mine from a table content format to a div content format. Table format Version: Table version of the website: here. Table version style CSS: body { width: 1020px; margin: 0 auto; background-image: url(images/bg.png); } .logo{ width:301px; … >>> More
CHAT ROOMs 7 by 6

as seen on Stack Overflow - Search for 'Stack Overflow'
I am looking for chatroom on one page with 7 loggedin users and 6+rows for say 42 users.these users will keep on adding wthnew users.Need urgent help.A PRETTY UNUSUAL Q FOR MOST OF U.What is MORE REQ new features: Usernames are unique to users currently chatting You can see a "currently chatting"… >>> More
Why can't I build Deluge?

as seen on Super User - Search for 'Super User'
Deluge is a BitTorrent Client. I am trying to build it from source, since I don't have privilege to install it as root. I am using python setup.py build. But, it failed following message, why? copying deluge/ui/web/themes/images/gray/slider/slider-v-thumb.png -> build/lib.linux-x86_64-2.4/deluge/ui/web/themes/images/gray/slider copying… >>> More
Warping Images using cvWarpPerspective Results in Some Parts of the images out of the viewable area

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, I am trying to stich two images together. In order to do so I extracted sift features and find matches on the two images using this C implementation. http://web.engr.oregonstate.edu/~hess/index.html After that I found the homography matrix using the matched points. http://www.ics.forth… >>> More