Now, how hard can it be to create two horizontally aligning 'cells', one containing an image and the other some text that goes with the image? Let's see how far we get, shall we.
Try guessing which is the table before you look at the source or read the textual content. Guess...
Glider pilots awaiting their turn to get up, all ready to go.
| the image | the full description of the image |
|---|---|
![]() |
Glider pilots awaiting their turn to get up, all ready to go. |
One can do it like the first example, using semantically correct markup, or, one can assume that there is a correlation between the images and the text and therefore say it actually is a table-worth tabular data thingy. With that, you could therefore build a proper table, which is the second example, and fix the looks of it using CSS:
Once you get going you'll soon find out there are more ways than one to emulate the looks of a table. I've therefore created a few examples, besides the simulation above:
See? Depending on your choice, well thought through choice, you can go either way. Bugger though that IE disbehaves with the size of the emulated table cell. But if you leave the borders out, who's to know?
This example was setup in response to a question on usenet, in newsgroup alt.html: Two Cells lined horizontally using CSS.
If you like this example, think it is useful, you could pay us a visit at PretLetters or at the section about Webdesign. The site is in Dutch though.
Maybe the index of the test area, of which this page is part, is worth checking out too, since in that part of my site I play around a bit. There might be something worth your while related to the main topic of this current page.
If you liked what you saw and I helped you out a bit with something, you could consider contributing something small so I can continu to put efford in this site. With that you help me to help you and others. Please visit my page (in Dutch) on bijdragen, contributions and donations. Thank you,