• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Jeanne Boyarsky
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Rob Spoor
  • Devaka Cooray
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Carey Brown
  • Frits Walraven
  • Tim Moores
Bartenders:
  • Mikalai Zaikin

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

 
Ranch Hand
Posts: 202
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • 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?
 
author
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • 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
    Number of slices to send:
    Optional 'thank-you' note:
  • 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 ]
 
Ranch Hand
Posts: 256
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • 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
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • 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
    Number of slices to send:
    Optional 'thank-you' note:
  • 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
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • 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
    Number of slices to send:
    Optional 'thank-you' note:
  • 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
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
style="width:200px"

Eric
 
Daniel Gee
Ranch Hand
Posts: 202
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Thanks. The DIV works now.
reply
    Bookmark Topic Watch Topic
  • New Topic