User Name Password Register
DaniWeb IT Discussion Community
All
What is DaniWeb IT Discussion Community?
You're currently browsing the HTML and CSS section within the Web Development category of DaniWeb, a massive community of 392,074 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 4,107 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our HTML and CSS advertiser: Lunarpages Web Hosting
Views: 1690 | Replies: 5
Reply
Join Date: Mar 2006
Posts: 24
Reputation: Anax is an unknown quantity at this point 
Rep Power: 3
Solved Threads: 0
Anax's Avatar
Anax Anax is offline Offline
Newbie Poster

Help Table breaking div

  #1  
Sep 19th, 2006
Hia,

I am trying to redesign my css based design. I now have a header, left floated column, main colum, and a footer that fits along the bottom (I was pleased to get this far).

However when I have a table in the main column, it is liable to break out beneath the left column when the browser window is small (in IE only). This is occuring without fixed widths in the table.

To see the type of page I'm trying to fix, without the floated left column, it is here:
an event list

I have tried at length to find the answer and would greatly appreciate any fresh ideas.
AddThis Social Bookmark Button
Reply With Quote  
Join Date: Dec 2004
Posts: 1,589
Reputation: tgreer is an unknown quantity at this point 
Rep Power: 7
Solved Threads: 34
Colleague
tgreer tgreer is offline Offline
Made Her Cry

Re: Table breaking div

  #2  
Sep 19th, 2006
You can style your table elements with "nowrap" to force the table to be a certain width. That way instead of collapsing when the window is tiny, users will have to scroll instead.

td { white-space: nowrap; }
Reply With Quote  
Join Date: Mar 2006
Posts: 24
Reputation: Anax is an unknown quantity at this point 
Rep Power: 3
Solved Threads: 0
Anax's Avatar
Anax Anax is offline Offline
Newbie Poster

Solution Re: Table breaking div

  #3  
Sep 19th, 2006
Originally Posted by tgreer View Post
You can style your table elements with "nowrap" to force the table to be a certain width. That way instead of collapsing when the window is tiny, users will have to scroll instead.

td { white-space: nowrap; }

That didn't quite work (forcing the table out), but it led me to straight to the solution which was
	table {
   table-layout: fixed ;
}

Wow! That's a huge relief. Many many thanks!

hmmm I think that might need checking in other browsers/versions
Reply With Quote  
Join Date: Mar 2006
Posts: 24
Reputation: Anax is an unknown quantity at this point 
Rep Power: 3
Solved Threads: 0
Anax's Avatar
Anax Anax is offline Offline
Newbie Poster

Re: Table breaking div

  #4  
Sep 19th, 2006
I discovered it was also necessary to add this when the content was longer
			td {

   overflow: visible ;
}
Reply With Quote  
Join Date: Jun 2004
Location: Hemet, CA
Posts: 427
Reputation: FC Jamison is on a distinguished road 
Rep Power: 5
Solved Threads: 17
Colleague
FC Jamison's Avatar
FC Jamison FC Jamison is offline Offline
Posting Pro in Training

Re: Table breaking div

  #5  
Sep 19th, 2006
Couldn't you simply give the table a fixed width?
Reply With Quote  
Join Date: Mar 2006
Posts: 24
Reputation: Anax is an unknown quantity at this point 
Rep Power: 3
Solved Threads: 0
Anax's Avatar
Anax Anax is offline Offline
Newbie Poster

Re: Table breaking div

  #6  
Sep 26th, 2006
Originally Posted by FC Jamison View Post
Couldn't you simply give the table a fixed width?

But I wanted to keep site as fluid as possible...
I've now gone through joomla and phpBB to remove much of the fixed widths of the <td>s...

You can use link above and navigate about. I've even managed a css footer
Reply With Quote  
Reply

Only community members can participate in forum threads. You must register or log in to contribute.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

 

DaniWeb HTML and CSS Marketplace
Thread Tools Display Modes

Similar Threads
Other Threads in the HTML and CSS Forum

All times are GMT -4. The time now is 12:11 pm.
Forum system based on vBulletin Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
©2003 - 2008 DaniWeb® LLC