2014-02-07 103 views
2

我知道這是業餘的東西,但我一直在努力,試圖讓這個權利,我似乎無法得到解決。CSS定位

enter image description here

請看看該網站的截圖。我正在嘗試使「呼叫...」文本內聯並放在最佳@地板徽標的右側。

下面的代碼HTML:

<div class="level0"> 
    <div class="topbar"> 
     <h1><% title_content %></h1> <div class="facebookbutton"></div> 
     <div class="phonetop">Customer services: <strong>0844 209 1560</strong></div> 
    </div> 
</div> 
<div class="header"> 
    <div class="level0"> 
    <div class="logonumber"> 
     <a href="/" class="logo"><img src="<% secure_url %>images/logo.png?r=1" alt="<% title_content %>" /></a> 
    <div class="headernumber"> 
     <h2>Call <br /> 01132 186 212 <br />for the best prices</h2></div> 
     </div> 
     <div class="headfloat">This contains all of the content located on the right hand side </div> 

CSS

.level0{ 
width:970px; 
margin:0px auto; 
clear:both; 
} 
.topbar{ 
height:41px; 
color:#747474; 
/*text-shadow: 1px 1px 2px #000;*/ 
} 
.header{ 
background:#fff; 
height:166px;/*was 126*/ 
} 

.logonumber { 
float:left; 
display:inline-block; 
} 

.logo{ 
display:block; 
} 

.headernumber{} 

包含導航,存儲卡的圖像,籃子和搜索。

任何幫助將不勝感激。

+0

您是否嘗試在兩個div上添加'float:left;'? – Avisari

+0

左側浮動'.logo' – Turnip

+0

我試過將浮動標誌左側浮動,但不起作用 – JCW

回答

0

你需要

.headernumber { 
    float: left; 
} 

,你還需要降低.headfloat元素的大小,因爲它的寬度不允許在同一行的所有三個要素

所以更改.headfloat規則

.headfloat { 
    float: right; 
    padding-top: 13px; 
    text-align: right; 
    width: 350px; /*was 460px*/ 
} 
+0

Thankyou這個作品足夠的空間! – JCW