Jul 25, 2008

Table Width Help - table width="100%" goes off screen

Free Web Hosting, No Ads > CONTRIBUTE > Computers > Programming Languages > HTML, XML etc..

free web hosting

Table Width Help - table width="100%" goes off screen

fffanatics
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;
}


 

 

 


Reply

Tyssen
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.

Reply

dontmaimyourself
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.

Reply



Got an Opinion! Express your Views! (no registration):-
Add your Reply/ Opinion/ Views/ Comments/ Suggestion/ Questions/ Queries etc.
Posts with decent grammar & English will be accepted and please refrain from profanities.
For asking a Question, We recommend you to sign-up (for free) so that you can track the topic easily.

Nature of your Post*: Opinion/ Reply/ Comments
Question/Query
Feedback to us.
       
Name   Email
Title/Question*

(Maximum characters: 10,000)
You have characters left.
Confirm Code:

Similar Topics

Keywords : width width 100 screen

  1. Max Table Width - (13)
    Well, I have a table that I don't want to be over 350 pixels in width - even on the largest
    screens. On small screens, the table will be smaller. But on large screens, I don't want the
    table to larger than 350 pixels... Is there a way to do that?...
  2. Width Of Display Area Of Browser Window - is there a formula? (6)
  3. Screen Resolution - I need a code to help out here please... (6)
    Hey everyone.. I was just wondering if there was a code/script that I could insert into my html
    website to change viewers resolution from 1024x800 to 800x600 or something to that effect. It's
    just I use 800x600 at home, and I programme it around that, and it's fine, but on some public
    computers it's default to 1024x800 and can't be changed.. Is there a script to chance
    this??? Help plz anyone!!! Thanks in advance, Sean....
  4. Centering Page Of Html At Various Display Widths - Viewing Screen Shots No Matter Resolution (14)
    I am running into a HUGE problem creating a website. When viewing the site on 800x600 it views in
    the center of the page. When viewing the site on 1024x768 it views on the left side of the page. How
    do I make the page always appear in the middle? I have seen many sites set up that will adjust
    accordingly, but I cannot figure it out. If you want to view my source you can do so by going to the
    website: www.faithcity.org/test.html. Moving to the html Topic ...
  5. Ie Table Width In A Div Tag - Table expands past screen at 100% (4)
    Hey everyone. I have been designing websites for a long time but i have recently decided to tryout
    the DIV layout technique instead of just using good old tables. However, this is the biggest problem
    i have come across. So I have a page where i need to have a table to display a whole bunch of
    details on armor in a game since the site is for players of final fantasy. However, when i do
    width="100%" so that the table expands the whole way to the side of the div so it looks the best it
    now will go past the edge and off the screen at 100%. Below is most of the code. Please h...
  6. Popup Window With Height And Width? - (9)
    I will try to explain: When clicking on the link, a pop-up window will be opened. I also want to
    have the width=300 and height=160 (just examples /wink.gif' border='0'
    style='vertical-align:middle' alt='wink.gif' /> ) Could someone give me a short code for that?...
  7. Adding Width And Height To Page - (8)
    how do you add width and height to your page? without adding it to your link you previously
    clicked... I mean, that the width and height should be included in the ORIGINAL page... i hope
    someone can help me with this... thanks in advance! /cool.gif' border='0'
    style='vertical-align:middle' alt='cool.gif' /> btw: i'm not that familiar with
    scripting......



Looking for table, width, table, width, 100percent, screen

Searching Video's for table, width, table, width, 100percent, screen
advertisement



Table Width Help - table width="100%" goes off screen



 

 

 

 

ADD REPLY / Got an Opinion! Remove these ADs! RAPID SEARCH! Free Web Hosting [X]
Express your Opinions, Thoughts or Contribute more info. to help others.
Ask your Doubts & Queries to get answers, So that "Together We can help others!"
Register FREE for AD-FREE forum, Create your own topics, Ask Questions, track topics, setup subscriptions & notifications and Get a Free Website w/ Email and FTP.
500MB Space *No Ads*, CPanel, FTP, PHP, MySQL, EMails - 100% FREE