Welcome Guest ( Log In | Register)



 
Reply to this topicStart new topic
> Table Width Help, table width="100%" goes off screen
fffanatics
post Jun 16 2005, 03:04 AM
Post #1


Privileged Member
*********

Group: [HOSTED]
Posts: 936
Joined: 14-April 05
From: West Chester, PA
Member No.: 5,636



Hey everyone. My problem is that current i have a left menu and a right menu which are created using a div the properties listed below. Then i have a center section to my website where i have a table that i need to fill the remaining space on the screen (aka the space from the right side of the left menu to the left side of the right menu). However, when i set the table's width to 100%, it goes of the screen. Can anyone help me with this? If you look at my main page, the news section works but only because the text forces the table to its largest size and then wraps. I need the table on the My Account page (only accessible by users that are logged in) to be the same size even though it does not have enough text in it to force it to that size. Feel free to register and check it out if needed. The link to my site is located in my sig. Here is the properties of my left, right, and center area divs:

CODE
#leftMenu {
background: url('./images/sidebar.jpg');
position : absolute;
left : 10px;
width: 150px;
z-index : 2;
background-color : #000066;
border-right: 1px solid white;
border-bottom: 1px solid white;
}

#rightMenu {
background: url('./images/sidebar.jpg');
position : absolute;
right : 9px;
width: 150px;
z-index : 1;
background-color : #000066;
border-left: 1px solid white;
border-bottom: 1px solid white;
}

.centerTable
{
background : url("images/tableBg.jpg");
border : 1px solid white;
}


Go to the top of the page
 
+Quote Post
Tyssen
post Jun 16 2005, 04:33 AM
Post #2



***********

Group: Members
Posts: 1,161
Joined: 9-May 05
From: Brisbane, QLD
Member No.: 6,818



That's a very strange mish-mash of using CSS and tables you've got going there. huh.gif Basically, your absolutely positioned sidebars are the wrong way to go about it. Take a look at http://www.pmob.co.uk/temp/3colfixedtest_4.htm for ideas & reference on how to go about creating column layouts using CSS.
Go to the top of the page
 
+Quote Post
dontmaimyourself
post Jul 2 2005, 03:09 PM
Post #3


Lord of the last day
*********

Group: Members
Posts: 526
Joined: 30-July 04
From: England
Member No.: 305



Instead of using absoultue positioning you could try the float attribute, something like this may do it.

CODE
#leftMenu {
background: url('./images/sidebar.jpg');
float : left;
left : 10px;
width: 150px;
z-index : 2;
background-color : #000066;
border-right: 1px solid white;
border-bottom: 1px solid white;
}

#rightMenu {
float : right;
right : 9px;
width: 150px;
z-index : 1;
background-color : #000066;
border-left: 1px solid white;
border-bottom: 1px solid white;
}


however when I did this I did not use a table for the center portion, i just used another div element. You should be able to get something close to the desired effect if you tweak that until it is close to how you want it. this was a while ago I did this so it may not be entirely accurate.
Go to the top of the page
 
+Quote Post

Reply to this topicStart new topic

Collapse

> Similar Topics

Topics Topics
  1. Max Table Width(13)
  2. Ie Table Width In A Div Tag(5)
  3. Centering Page Of Html At Various Display Widths(14)
  4. Screen Resolution(6)
  5. Width Of Display Area Of Browser Window(6)


 



- Lo-Fi Version Time is now: 10th October 2008 - 06:57 PM