Find solution
How to display HTML table with angularJS?

Css style problem: table fall down when browser zoom is 60% or less. The html code is here.?

  • The html code below works fine in any browser if zoom is normal. If 60% or less, then here is a problem. Why does it happen? How to fix it? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-… <HTML> <BODY> <DIV style="MARGIN: 0px 100px 0px 300px" > <DIV style="BORDER-BOTTOM: #0aa2fa 1px solid; POSITION: relative; BORDER-LEFT: #888 1px solid; BACKGROUND-COLOR: #762939; WIDTH: 100px; DISPLAY: inline; WORD-WRAP: break-word; FLOAT: left; TABLE-LAYOUT: fixed; HEIGHT: 400px; MARGIN-LEFT: -103px; BORDER-TOP: #0aa2fa 1px solid; BORDER-RIGHT: #0aa2fa 1px solid"> </DIV> <DIV style="BORDER-BOTTOM: #0aa2fa 1px solid; POSITION: relative; BORDER-LEFT: #888 1px solid; BACKGROUND-COLOR: #762939; WIDTH: 100px; DISPLAY: inline; WORD-WRAP: break-word; FLOAT: right; TABLE-LAYOUT: fixed; HEIGHT: 400px; BORDER-TOP: #0aa2fa 1px solid; MARGIN-RIGHT: -103px; BORDER-RIGHT: #0aa2fa 1px solid" > </DIV> <DIV> <DIV style="BORDER-BOTTOM: #0aa2fa 1px solid; BORDER-LEFT: #0aa2fa 1px solid; BACKGROUND-COLOR: #e3f2f7; BORDER-TOP: #0aa2fa 1px solid; BORDER-RIGHT: #0aa2fa 1px solid">S </DIV> <SPAN>This text is still above. Everything is OK, but if you reduce your browser to 60% zoom (usin Ctrl -), the text below will fall down. Why? </SPAN> <TABLE style="border:solid 10px #0aa2fa; table-layout:fixed; word-wrap:break-word; WIDTH: 100%"> <TBODY> <TR> <TD>This text falls down - how to fix? </TD> </TR></TBODY> </TABLE> </DIV> </DIV> </BODY> </HTML>

  • Answer:

    If you fix the width it will stay. Because the content makes it fall. Since you set 100% width. Create another table inside with fixed width!! It will work ^__^

Champo at Yahoo! Answers Visit the source

Was this solution helpful to you?

Related Q & A:

Just Added Q & A:

Find solution

For every problem there is a solution! Proved by Solucija.

  • Got an issue and looking for advice?

  • Ask Solucija to search every corner of the Web for help.

  • Get workable solutions and helpful tips in a moment.

Just ask Solucija about an issue you face and immediately get a list of ready solutions, answers and tips from other Internet users. We always provide the most suitable and complete answer to your question at the top, along with a few good alternatives below.