方塊不漂浮

看了，但沒有找到合適的答案。方塊不漂浮

我的問題很簡單：試圖浮動，沒有成功。

這裏的頁面：http://www.linguashop.com/course/classic.php

左邊的紅色框應左浮動，與greybox和菜單上來就對了。

enter image description here

我使用的CSS低於：

.logo2013,  
.logo2013 a  {margin:0;width:220px;height:120px;} 

.logo2013 {float:left;} 

.logo2013 {border:1px solid #f00; border-top-left-radius: 10px; } 

.logo2013 a  {display:block;text-indent:-9999px;} 

.greybanner2013 {height:91px; line-height:1; background:#f7f6f2 left top;} 
.greybanner2013 {border:1px solid #ddd; border-top-right-radius: 10px;} 

.greybanner2013 .fontsize32 h2 {padding-top:5px; font-size:32px;color:#777;font-weight:bold; margin:0; margin-left: 20px; } 

.greybanner2013 .foreign {font-size:32px;color:#FF9300;font-weight:bold; display:inline; margin:0; margin-left: 20px; padding:0; } 

.greybanner2013 .translation {font-size:28px;color:#AAA;font-weight:normal; display:inline; margin-left: 10px; } 

/*menu*/ 

.nav2013 {height:28px; background-color:#787065; border:1px solid #ccc; } 

.nav2013 ul {/*float:right;*/ list-style:none;margin:4px 0;padding:0} 

.nav2013 li {float:left;padding:0 24px 0 22px;margin:0; right top no-repeat*/} 

.nav2013 li a {font-family:Verdana,Arial,SunSans-Regular,Sans-Serif; display:block;color:#ebeae8;text-decoration:none;font-size:12px; font-weight:bold; } 

.nav2013 li:last-child {padding-right:15px;background:none}

任何有識之士將不勝感激！

大衛

來源

2013-04-21 Cymro

在firefox中我看起來不錯。 http://i.imgur.com/dfMjAl3.png – 2013-04-21 09:14:25

對我來說也很好看 – btevfik 2013-04-21 09:15:05

它應該一直向左飄蕩嗎？ – btevfik 2013-04-21 09:15:50

這是我所看到的 enter image description here

，如果你想浮紅色框的左邊一路;

再加入logo2013直屬banner2013

它將創建這個

enter image description here

UPDATE

我覺得你的問題是在左上角的邊界半徑。這應該解決它。

它添加到.greybanner2013

border-top-left-radius:10px;

具有邊框半徑等，其可以覆蓋有背後的灰色區域，你放在那裏的標誌。實際上浮動紅色框左側並保持正確，同時保持他們在屏幕中間需要更多的工作，可能更改html和css相當多。

您可以將logo2013類的背景顏色設置爲white，這也會產生類似的效果。

來源

2013-04-21 09:19:22 btevfik

回答

相關問題