2013-06-29 28 views
1

我試圖讓他們的投資組合網站的朋友,一切都很簡單,但我似乎無法獲得橫向導航觸摸內容框。我已經接近它,最多也許是50到75,100像素,但他們根本不會碰。我需要一個div框,以正確反對另一個div框

這是有關兩個div的代碼。我能夠在別人的問題幫助下扭轉導航,但他們仍然不會坐下。任何幫助都將不勝感激,非常感謝您的時間。

.background { 
background-image: url(textureimg.jpg); 
width: 800px; 
height: 1000px; 
float: left; 

}

.navigation { 
float: left; 
/* Safari */ 
-webkit-transform: rotate(90deg); 
/* Firefox */ 
-moz-transform: rotate(90deg); 
/* IE */ 
-ms-transform: rotate(90deg); 
/* Opera */ 
-o-transform: rotate(90deg); 
/* Internet Explorer */ 
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); 

}

+0

學習螢火蟲或開發人員工具將大大受益。 https://developers.google.com/chrome-developer-tools/docs/videos – phillip

回答

1

大概保證金問題。嘗試.navigation { margin-right: 0px; }。除非您的導航位於右側,否則請使用margin-left。您可能還需要調整內容部分的邊距。

元素中的所有「內容」僅佔用該元素屏幕空間的一小部分。其餘的爲填充,邊界餘量。這些可以分別通過padding: 10px;,border: 5in;,margin: 3pt;分別調整(顯然你可以使用任何你想要的大小值)。您還可以操縱單個邊,如padding-right: 10px; padding-top 5px;

如果調整導航的邊距不能提供所需的結果,請嘗試調整邊框和邊距。

HTML box model http://www.html.net/tutorials/css/figure008.gif

有一個很好的介紹到HTML框模型here

0
#content { position: relative; left: -50px; } 

調整需要,直到它留給然而,許多像素不是太熱或太冷,但恰到好處