CODEWITHSUNDEEP
htmlcsswidthcontainers
erfgh
erfgh

Reputation: 11

Table 'width' css property does not prevent table property from exceeding the width of its container

Here is the offending website: http://giorgostzampanakis.pythonanywhere.com/ratings/ .

Try resizing the browser window until it's about 500 pixels wide and note how the table on the left ends up bigger than its containing div (you can check that with firebug or a similar tool), even though the table's width is set to 78%.

Is the 'width' css property treated specially when it comes to tables? I haven't been able to find any documentation stating that.

Upvotes: 0

Views: 587

Answers (1)

ArleyM
ArleyM

Reputation: 853

The reason that table is bigger than the parent container is because the content makes it so! If the content was made up of one character strings (eg. 1 1 1 1 1) it would probably all wrap nicely!

If you're going for a responsive table there are a lot of solutions like hiding columns or other stylistic things. I'd recommend Googling for solutions, but here are a couple decent links to get you started!

Responsive Table Round Up Responsive Data Tables

Upvotes: 2

Related Questions