Win a copy of Mesos in Action this week in the Cloud/Virtualizaton forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

Failed to Set the Height and Width of a Surrounding Box Using DIV

 
Daniel Gee
Ranch Hand
Posts: 202
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I have a table created by using the <table>, <tr>, <td> tags.

I tried to surround the table with a box of solid, red-colored line and I used the <div> to do it. But, the solid, red-colored lines were drawn along the edge of the computer screen.

I want this box simply surrounds the table I created. Here is my code:

In my Master.css, I have

What am I missing?
 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
why don't you apply it to the table? The div is a block element and takes up the entire width of a page.

Eric
 
Daniel Gee
Ranch Hand
Posts: 202
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I have tried to use the "border" attribute to give my table a surrounding box. However, I also get border surrounds each cell in that table.

I do not want border for each cell. I only want something like a box around the table.

It seems that <table border bordercolor="#xxxxxx"> does not do the trick.

<div> is not the answer. The "border" attribute of the <table> tag gives another problem. What should I do? Thanks.
[ March 03, 2006: Message edited by: Daniel Gee ]
 
Niki Nono
Ranch Hand
Posts: 256
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
prepare a style as follows and attach it to the table.



Read up on the styles given above.
I found this place to e one of the best resources for CSS.
http://www.w3schools.com/css/css_reference.asp

The URL failed to become a URL. Maybe the site maintenance team should look into it.
[ March 05, 2006: Message edited by: Niki Nono ]
 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Then add styles to the cells:

table{ border: 2px; solid black;}
td,tr,th{ border: 0px;}

Eric
 
Daniel Gee
Ranch Hand
Posts: 202
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks a lot for the code. Now, I am able to draw a surrounding colored box around a table.

I still wonder why <DIV> does not work.
 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Originally posted by Eric Pascarello:
The div is a block element and takes up the entire width of a page.

Eric


You would have to set the width of the div in order for that not to happen.

Eric
 
Daniel Gee
Ranch Hand
Posts: 202
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
How to set the width of the DIV?

I tried to set it but did not work. Apparently, I did something wrong.
 
Eric Pascarello
author
Rancher
Posts: 15385
6
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
style="width:200px"

Eric
 
Daniel Gee
Ranch Hand
Posts: 202
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks. The DIV works now.
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic