•
•
•
•
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
![]() |
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.
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.
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; }•
•
•
•
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
I discovered it was also necessary to add this when the content was longer
td {
overflow: visible ;
}![]() |
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
•
•
•
•
•
•
•
•
DaniWeb HTML and CSS Marketplace
- css div's and tables table cells and scrolling (HTML and CSS)
- CSS Div's For Myspace (HTML and CSS)
- Go to a certain page when button is pressed and do it securely (ASP.NET)
- ASP.NET and Mozilla - Issues! (ASP.NET)
Other Threads in the HTML and CSS Forum
- Previous Thread: includes - trying to bring modules into html documents
- Next Thread: Html break and spiders question



Linear Mode