Basics: CSS tables

Hope all is well,

I am having some difficulties getting my layout to span correctly. When I run it in the browser the table does not take up 100% of the view port; only a portion as you will all see. I’m not sure what I am doing wrong here:


    <link type="text/css" href="style/basic-style.css" rel="stylesheet">
	<div class="table">
	  <div class="table-row-one">
	    <div class="table-cell-one">
		<b>TOPIC 2</b>
		<div class="table-cell-two">
		  <b>Linux installation and upgrade (part I)</b>
		<div class="table-cell-three">
		  <b>Practical guide to Linux systems administration</b>
	  </div> <!-- End of table row -->
	</div> <!-- End of table -->

And the style sheet,


/* Basic stylesheet */

body {
	background-color: #fff;

div.table {
	display: table;
	width: 100%;

	display: table-row;

div.table-cell-one, div.table-cell-two, div.table-cell-three{
	display: table-cell;

Any ideas let me know, here is the look and feel I’m actually going for here.

Did you give the body {padding:0; margin:0;}

Excellent that did the trick. In fact the table did span the whole width of the browser I just could not tell because there was not a background color.


Anytime. :slight_smile:

Thanks for the feedback.