Jump to content

DIV or Table for MySQL output?


andreasb

Recommended Posts

Hello,

 

I'm creating a website where I want there to be 5 images per row (with several rows) with some text below each image. The image path and description is fetched from a MySQL database.

Now, which should I chose; DIV or Tables when it comes to making horizontal rows of images from MySQL?

 

I've tried using tables in the mysql_fetch_array, but the results are only 1 image per row with the description below it, so it doesn't make a horizontal line of images and descriptions.

 

Please help me out :)!

Link to comment
Share on other sites

Since there's no natural way to do captions, you can wrap DIVs around each element to apply the text underneath the image.

 

<div class="box">
<img src="pony.jpeg">
<div class="caption">This is my pony</div>
</div>

 

Then put five of those in a single DIV for each row.  You'll have to add some styles to make it the way you want but this will give you an idea.

Link to comment
Share on other sites

Yes, use the CSS to style the divs to the desired widths, heights, positions, etc. What I usually do is have wrapper divs, for example  <div class="picturesWrapper">, then inside have <div class="pictureRow"> and <div class="caption">

 

You can then easily change options from the CSS by modifying each class. I find this way of working to be very flexible when there is need for changes.

 

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.