html table

Hello,
I want to know how to do that in xhtml:
http://imageshack.us/photo/my-images/7/screenshot004ki.jpg/
Thank you in advance for your help.

 

you can do it if, you know HTML/CSS.

 

Yes but I would just like to know how to do and what to put in the css for it gives this result.

 

easier way use HTML4 tables (DW have all the option to create such tables). hard to create tables with CSS n div

 

And still if you don't want to use tables.
There are two ways to create it using divs.
One way is to make three main divs, floating to the left.
Now you can see in the image, you have three columns, so these 3 divs will act like three columns.
In each of these columns(divs) you can place further divs over one another to create these boxes.

Set the properties of the divs, like width, height, background-image, margin, padding etc. to construct it properly.

 

Okay thank you i got it

 

use dreamweaver, for table I think better to use inline style

 

If possible please use external CSS. Inline is ok if you don't want to change it often.

 

if you learn about HTML or CSS you'll fix it easy

 

Wow, what is this, invasion of the ten post wonder ****'s?!?

Of course, even the seemingly legitimate users posted absolute idiotic responses -- from non-semantic use of DIV (since this appears to be tabular data) to letting dreamweaver make code for you; I'm surprised one of the 'use jquery' wankers hasn't piped in yet.

This is tabular data, use a table. I'll use the image from if you hit 'previous' on imageshack as the example -- because it's more meaningful if you have actual data to work with. I'll toss a second 'set' on there too.

<table class="schedules">

	<thead>
		<tr>
			<th scope="col">Departure</th>
			<th scope="col">Arrival</th>
			<th scope="col">Approximate Prices</th>
		</tr>
	</thead>
	
	<tbody>
	
		<tr class="first">
			<th scope="row" rowspan="4">Sophia Antipolis</th>
			<td>Antibes</td>
			<td>35 &euro;</td>
		</tr><tr class="even">
			<td>Nice</td>
			<td>60 &euro;</td>
		</tr><tr>
			<td>Cannes</td>
			<td>40 &euro;</td>
		</tr><tr class="even">
			<td>Airport</td>
			<td>50 &euro;</td>
		</tr>
		
		<tr class="first">
			<th scope="row" rowspan="2">Nice</th>
			<td>Cagnes Sur Mer</td>
			<td>15 &euro;</td>
		</tr><tr class="even">
			<td>San Remo</td>
			<td>35 &euro;</td>
		</tr>
		
	</tbody>
	
</table>

Code (markup):

Would be the proper HTML for that type of data -- scope providing all the semantic relationships, rowspan letting the left side headings span multiple rows.

Then it just needs CSS to make it pretty

.schedules {
	border-collapse:collapse;
}

.schedules td,
.schedules th {
	padding:0.25em 1em;
	text-align:center;
	vertical-align:middle;
	border:solid #FFF;
	border-width:1px;
}

.schedules th {
	color:#FFF;
	background:#5AF;
}

.schedules .first th {
	border-width:4px 4px 0;
}

.schedules .first td {
	border-width:4px 1px 0; 
}

.schedules td {
	color:#000;
	background:#DEF;
}

.schedules .even td {
	background:#CDF;
}
</style>

Code (markup):

Simple stuff really... or at least simple if you know how to use a table PROPERLY -- of course between most developers being blissfully unaware of THEAD, TBODY, TH, CAPTION or SCOPE, and most of the rest having this intense nutjob paranoia of "never ever use tables" even when it's tabular data, the number of people who use tables properly can likely be counted on one hand.

 

Better to learn your self.....
check w3schools.com

 

HTML5 looks like the way to go..