html table design help

antony · #1 Mar 8th, 2007, 12:09

I have tried creating a table in both dreamweaver and frontpage but struggling to find a way how to join both the first row and the second row to make them look like the following below. I also need to find out how to make the gaps between the boxes look bigger and on clicking of the link it changes the box bg and enables the link to go a bold white.

all help is very much appreciated; image below of what i want to make.

cheers

karinne · #2 Mar 8th, 2007, 12:37

Well ... you shouldn't be using a table to do this. You should be using a list and styling it with CSS.

Here's a good start to get you going on using list and CSS
CSS Design: Taming Lists

antony · #3 Mar 8th, 2007, 13:41

Quote:

Originally Posted by karinne

Well ... you shouldn't be using a table to do this. You should be using a list and styling it with CSS.

Here's a good start to get you going on using list and CSS
CSS Design: Taming Lists

Will that help me make that, like exactly? Or is that just a beginner tutorial?

karinne · #4 Mar 8th, 2007, 13:42

A beginner tutorial ... you have to start somewhere.

daygon · #5 Mar 8th, 2007, 16:17

Always and if there are roll overs then you can find more tuts for css rollovers and fake iframes and all sports of junk that css can pull off.

verkevinmanering69err455 · #6 Mar 11th, 2007, 01:25

Quote:

Originally Posted by antony

I have tried creating a table in both dreamweaver and frontpage but struggling to find a way how to join both the first row and the second row to make them look like the following below.

Oky's first off stay away from frontpage - keep to either Dreamweaver or notepad++.

If i want two tables which sit on top of each other but look like one when filled with either a color or image the html code looks like this:

Code: Select all

<body>
<!-- Table1-->
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" height="100"></td>
</tr>
</table>

<!-- Table2-->
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100%" height="100"></td>
</tr>
</table>
</body>

Quote:

Originally Posted by antony

I also need to find out how to make the gaps between the boxes look bigger and on clicking of the link it changes the box bg and enables the link to go a bold white.

If your wanting gaps in empty tables your probably looking at making spacer images. To change the background when you click a link your looking at including a CSS styles sheet (make it external)

Hope this helps

JacobHaug · #7 Mar 12th, 2007, 16:32

TRY to stay away from tables, and dreamwever and frontpage. There are loads of free (or not) text editors out there...here are some.

Windows
Notepad
Notepad++
PsPad
Textpad
NVU
Crimson Editor

Mac
BBEdit
Text Wrangler

and millions more...

Some of the ones I listed for windows you can put on your flash drive, and or even run on Linux. My favorite of all is PsPad!!

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Rounded rectange for BG of certain items in an HTML table	btyo462	Web Page Design	12	Feb 11th, 2008 23:41
[SOLVED] Putting CSS with an HTML Table.	mcdanielnc89	Web Page Design	6	Nov 2nd, 2007 05:13
.swf file as HTML table background	bubberz	Flash & Multimedia Forum	9	Jun 18th, 2007 21:45
Need help in clone html table	bryanpung	JavaScript Forum	1	Jun 15th, 2007 14:12
Find(on this Page) Feature for HTML table	sameer2k	JavaScript Forum	1	Jul 8th, 2006 12:51

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
html table design help