为什么在放大浏览器时只有字体大小会增加？答案

【问题标题】：Why does only font sizes increase on zooming in browser?为什么在放大浏览器时只有字体大小会增加？
【发布时间】：2014-07-26 14:43:37
【问题描述】：

我正在尝试使用 CSS 媒体查询和相对宽度/高度值（以 % 为单位）的响应式布局。在我从浏览器放大之前，在所有屏幕宽度上一切正常。当我放大时，只有字体大小增加，而 div 容器的高度/宽度保持不变。这“破坏”了我的设计。有什么解决办法吗？

html:-

    <html>
    <head>
    <link href="style.css" type="text/css" rel="Stylesheet" />
    </head>
    <body>


    <div id="banner" style="background-color:Black; width:100%; height:15%">
    <div  style="margin-left:10%; width:20%; float:left"> <img id="logo" src="b.jpg" />
    </div> 
    <div id="title" style="  float: right; color:White"> Ganju and his activities</div>
    </div>
    <div id="dir_cont" style="margin:auto;"> 
    <img id="dir" src="a.jpg" /> <span id="dir_a">We like to introduce ourselves as     
    a........*some text*
    </span>
    </div>

    </body>
    </html>

还有css文件：-

    #dir_cont
    {
     width: 80%;
     }

    #dir
   {
    width:30%;
    float:left;
    }

    #dir_a
    {
    width:70%;
    float:left;

     }


    #logo
    {
    height:100%;
    }

    #title
    {
    margin-right:10%;
    }

    @media all and (max-width:450px){
    #title
    {
    font-size:3vw;
    margin-right:0%;

    }
    #dir_cont{width:100%}
    #dir{width:100%;

    float:none;
    }
    #dir_a
    {
    width:100%;
    float:none;
    }

【问题讨论】：

你的代码在哪里?????????
尽可能附上代码或准备jsfiddle

标签： html css

【解决方案1】：

百分比大小取自父容器。如果父级具有固定大小（例如 px），那么您将始终获得固定大小。查看http://css-tricks.com/css-font-size/

【讨论】：