View Full Version : Layout without tables.

05-26-2010, 06:29 PM
What would be the best way to lay out the following info without using a table?

currently it is in a table format. the code is really ugly with inline styles. i am new to html and css, but know that there is a better way to lay this material out. any pointers?

Ministry Staff
S. Steve Park Senior Pastor email@email.com

Fred Porter Assistant Pastor email@email.com

Jong H. Koo Administrative Director email@email.com

James Park Youth & College Pastor email@email.com

Yungsil Chang Children's Ministry Director email@email.com

Jane Cha Missionary-in-Training/ Children's Ministry email@email.com

Music Ministry Staff

Edmund Moon Worship Leader email@email.com
Lynn Cho Accompanist email@email.com


Young Cho email@email.com
Estela Hwangbo email@email.com
Insoo Kang email@email.com
David Kim email@email.com
Jeff Kim email@email.com
Joseph Kim email@email.com
Lina Kim email@email.com
Gina Koo email@email.com
Mike Lee email@email.com
Vivian Lee email@email.com
Edmund Moon email@email.com
JeanHee Moon email@email.com
Jin Yoo email@email.com

Thank you!

05-26-2010, 07:09 PM
Use divs and css thats the best way


05-26-2010, 08:19 PM
Lots of general information here. (http://www.exitfegs.co.uk/Sources.html)


Use the search facility.

05-26-2010, 10:51 PM
Use the correct elements for the information, so you'd probably have a 3 DIV's holding each of the individual sections, then within these DIV's you could add spans around any text you'd like to set a special style to..

Or if it is a list then you might be better off using the list elements (http://www.w3schools.com/tags/tag_ul.asp)to list out the people.

You then use the CSS to control the presentation/look of these elements.

05-26-2010, 11:00 PM
thank you everyone!

Major Payne
05-28-2010, 03:29 AM
Unordered list tags (http://www.w3schools.com/tags/tag_ul.asp) would be the way to go. Then you can use a nicely styled div/CSS combo to make it look nice on the page.

One suggestion. If those are personal email address, I would not use them as such. If they are email addresses set up for site use, then no problem. Either way, the "mailto:" gathers a lot of spam. Might look into "munging (http://www.projecthoneypot.org/how_to_avoid_spambots_3.php)" your email addresses.

code beginner
05-29-2010, 12:09 AM
you can use an unordered list.

it looks kind of like this:

<li>joe smith, joe@email.com</li>
<li>bill smith, bill@email.com</li>
<li>bob smith, bob@email.com</li>
<li>sally smith, sally@email.com</li>
<li>paul smith, paul@email.com</li>

then what you do is you use the css class property to tell each list item to look a certain way. kind of like (in the css):

.li {size:.... , color:.... font-type:.......}