文本移動當瀏覽器調整大小

我現在正在一個網站上工作，而且我遇到了與我的文本有關的問題。當我縮小時，文本開始堆疊，實際上離開了我的div。我有一個固定的寬度和高度的div，並且將其包裹在其他div中，並且不能爲我的生活弄清楚這一點。只有文字移動，其他所有內容都保留。這看起來似乎有點喜歡這個文本移動當瀏覽器調整大小

期望：

這是我的方式文本
是
我想這是

實際：

這
是

文字

當我縮小文字往往堆積起來，並推出的股利。

.content { 
    width: 960px; 
    margin: 0 auto; 
    } 

    .contentleft{ 
    float: left; 
    width: 480px; 
    } 

    .contentright{ 
    float: right; 
    width: 480px; 
    } 

    .boxone { 
    float: left; 
    clear:both; 
    height: 211px; 
    width: 230px; 
    background-image:url(../images/rec1.png); 
    } 

    .textone { 
    width: 220px; 
    height: 200px; 
    overflow:hidden; 
    clear: both; 

    }

HTML

 <div class=content> 
      <div class=contentleft> 
       <div class=boxone> 

        <div class=textone> 
       <p> TEXT TEXT TEXT TEXT </p> 

        </div> 
        <div class=learnone> 
        </div> 
       </div> 

       <div class=boxtwo> 
       </div> 
      </div> 

      <div class=contentright> 
       <div class=boxthree> 
       </div> 
       <div class=boxfour> 
       </div> 
      </div> 
     </div>

我能做些什麼，以移動停止的文字？

來源

2013-02-26 Peter Jewicz

請的jsfiddle它 – abbood 2013-02-26 06:20:44

http://jsfiddle.net/KkUAV/繼承人問題的代碼，雖然它並不炫耀我放大了的問題。 – 2013-02-26 06:46:16

這是瀏覽器的行爲，可以放大頁面中的所有項目，但作爲開發人員，您可以指定像素中的字體大小。

font-size:12px;

來源

2013-02-26 06:21:23

嘗試簡單只是增加div的寬度。

例

.contentleft { 
    width: 800px; 
}

來源

2016-05-30 15:17:19

文本移動當瀏覽器調整大小

回答

相關問題