In this site page you can see that the table in the middle of page is too wide and is exte开发者_如何学Cnding beyond it's parent div.
How to correct it? Any suggestions!You need to reduce the size and/or amount of the content in the table. No amount of css or width attributes will reduce the size of the table if it is already at the minimum width that will contain the content.
EDIT
As suggested by Projapti, if you don't mind having a scrollbar on the page, adding a CSS overflow-x:scroll
to the containing div will prevent the table from overflowing. However, I would further suggest that you wrap an additional div around just the table, so that only the table will be scrolled content. Have a look at the live preview below to see the effect.
Live preview ->
EDIT 2
Here's an example of the table contained within a height-adjusted div, as mentioned in one of my comments below:
Live preview 2 ->
you can try to add this on the parent div: style="overflow-x:scroll"
<div id="mts" class="icc telecom" style="overflow-x:scroll">
In my test in ff, it scrolls...
No magical CSS needed. You need to redesign the table so that the headings are along the X axis.
精彩评论