html – 谷歌浏览器：文字不会正确最小化

概述Google Chrome真的给我带来了障碍,我需要一些帮助. 我正在设置菜单,缩小时文本正在换行(<50％).我不想使用white-space：nowrap,我不能让我的菜单更宽. Safari,Firefox,甚至IE浏览器 - 没有任何问题,但是当使用chrome缩小它时会强制自动换行.有任何想法吗.如果需要更多的html / css,请告诉我,我试图简化一些事情： CSS： #page{ Google Chrome真的给我带来了障碍,我需要一些帮助.

我正在设置菜单,缩小时文本正在换行(<50％).我不想使用white-space：nowrap,我不能让我的菜单更宽. Safari,firefox,甚至IE浏览器 - 没有任何问题,但是当使用Chrome缩小它时会强制自动换行.有任何想法吗.如果需要更多的HTML / CSS,请告诉我,我试图简化一些事情： CSS：

#page{    display: block;    overflow:visible;    Font:"Times New Roman",Times,serif;    text-align: center;    margin: auto;    wIDth: 100%;    height: 1000px;    background:#956e41;}#header{    wIDth:auto;    max-wIDth:1105px;    margin:auto;    position: relative;    overflow:visible;}#mainPicture{    height:475px;    wIDth: 1105px;    background-image:url(images/main.jpg);    background-repeat:no-repeat;    margin: auto;    position: absolute;}#headerFrame{    height:80px;    margin: auto;    wIDth: 1080px;    background-color: #a15535;    position: relative;}#logo{    height: 150px;    wIDth: 340px;    margin: auto;    background-image:url(images/logo.png);    float: left;}#menuFrame{    wIDth:auto;    max-wIDth: 740px;     margin: auto;    wIDth: 1080px;    display:inline-block;}#menu{    wIDth:auto;    Font-size:16px;    Font-weight:600;    margin: 0 0 0 0 ;       text-align:right;    display:inline-block;}#menu ul{    margin-left: 80px;  }#menu ul li{    List-style:none;    float:left;    margin: 0 0 0 10px;    padding: 0 10px 10px 0;         }

HTML：

<div ID="page">    <div ID="header">        <div ID="mainPicture"></div>            <div ID="headerFrame" >            <div ID="logo">                <!--<img src="images/logo.png" />-->            </div>            <div ID="menuFrame">                    <div ID="menu">                    <ul>                        <li >menu1<br /><span>text</span></li>                        <li >THE menu1<br /><span>text</span></li>                        <li >menu1<br /><span>text</span></li>                        <li >menu1<br /><span>text</span></li>                    </ul>                    </div>            </div>        </div>    </div></div>

一些CSS可能看起来多余,我失去了我的冷静,并开始只是扔东西…从来没有好.

演示：http://jsfiddle.net/X48ng/

^用Chrome打开并缩小….你会看到(向右滚动文本)

约翰

解决方法 好吧,我想我确切地看到了它造成了什么,但它有点像你想要的东西,

稍微弄乱了小提琴后,我设法通过移除#menu ul {}项目上的边距左边,在缩小到33％时停止将菜单项推到新行,

如下图所示：
js Fiddle(当缩小到25％但现在可以缩小到33％而不是仅50％时仍然会发生)

我能想到的唯一一件事就是造成这种情况;随着页面调整大小,边距被放大或沿着这些线条,

如果有人可以帮助改善这个答案,请做.

史蒂夫.

总结

以上是内存溢出为你收集整理的html – 谷歌浏览器：文字不会正确最小化全部内容，希望文章能够帮你解决html – 谷歌浏览器：文字不会正确最小化所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。