2013-05-13 82 views
0

我在一個塊中有一些div彼此靠近,我希望他們留在同一個塊(線)上讓屏幕更大(CTRL +),這裏是我的代碼( http://fiddle.jshell.net/YDyfy/), CSS:Divs保持內嵌塊屏幕更大

#menu{ 
width:100%; 
height:40px; 
margin:auto; 
padding:0 0 12; 
background:url(file:///C:/Users/Windows7/Desktop/imgbg.jpg) repeat 0 0 #f8f8f8; 
border:1 solid; 
border-width:0 1 1; 
box-shadow:0px 1px 10px #000; 
text-align:center; 
position:fixed; 
top:0; 
left:0; 
right:0; 
} 
.menutext{ 
font-family:Helvetica neue,Helvetica,Arial,Verdana,Sans-serif; 
font-size:16; 
display:inline-block; 
border:solid; 
border-color:#aaa #ccc; 
border-width:0 0 5 6; 
padding:6 40 7 40; 
margin:7 15; 
box-shadow:-1px 2px 5px #404040; 
} 

HTML:

<div id="menu"> 
<a href="#div1" class="scroll"><div class="menutext" linkId="div1">Description</div></a> 
<a href="#div2" class="scroll"><div class="menutext" linkId="div2">Shipping and payments</div></a> 
<a href="#div3" class="scroll"><div class="menutext" linkId="div3">Seller information</div></a> 
<a href="#div4" class="scroll"><div class="menutext" linkId="div4">Feedback</div></a> 
</div> 

簡單地說,我要當屏幕變得更大的div停留在同一行/塊

+0

你確定它不是填充引起的?你想保持一個規則嗎?或更多規則? – DiederikEEn 2013-05-13 12:47:38

+0

您是否看不到我在您之前提出的問題中發佈的額外評論?我認爲這是爲了設置固定的像素寬度,需要在百分比時間內完成所有事情。 http://stackoverflow.com/questions/16520783/background-gets-smaller-and-divs-get-under-each-other-while-changing-screen-size/16521020#16521020 – Doug 2013-05-13 12:52:14

+0

One rule,inline-block – 2013-05-13 12:55:41

回答

0

我是李很困惑。你希望他們都出現在同一行?或分開行嗎?

如果你希望在窗口增加時將它們全部放在一行上,那麼我認爲你提供的小提琴沒有問題。

如果您希望將它們全部放在單獨的行中,請在您的CSS中將display屬性更改爲block

+0

小提琴它顯示在對方之下,只需按CTRL - 兩次,所以你可以看到他們在同一行,我希望他們一直保持這樣的狀態,如果我有更大的屏幕(如果我按CTRL +) – 2013-05-13 12:49:18

+0

@MhmdRobaee你知道,這種行爲與CTRL -/+是高度依賴用戶的瀏覽器大小正確嗎? – 2013-05-13 12:51:22

1

在容器上使用white-space:nowrapupdated Fiddle)。

你的問題很不清楚,所以如果這不是你要找的東西,請不要開槍。

作爲一般性旁註,您不應該在內聯元素(如<a>)內嵌入塊級元素,如<div>。如果有的話應該是<span>元素。

+0

好的解決方案 - 但是當你達到全寬時要小心,因爲菜單會跳出頁面的一邊,迫使人們側身滾動以達到菜單的末尾。 – Doug 2013-05-13 12:56:42

+0

你做到了兄弟,非常感謝你,@doug你給了我同樣的解決方案,也謝謝你! – 2013-05-13 12:59:23

+0

我得到了另一個問題:/我不能看到divs當我CTRL +,它應該給我滾動條,讓我滾動到divs,所以我可以看到它,有什麼解決方案? – 2013-05-13 13:01:00

0

你錯過了填充,邊距和字體的一些像素,我認爲由於這個原因你得到了這個問題。 以百分比或EM使用字體大小。