2013-04-21 57 views
0

看了,但没有找到合适的答案。方块不漂浮

我的问题很简单:试图浮动,没有成功。

这里的页面: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} 

任何有识之士将不胜感激!

大卫

+0

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

+0

对我来说也很好看 – btevfik 2013-04-21 09:15:05

+0

它应该一直向左飘荡吗? – btevfik 2013-04-21 09:15:50

回答

1

这是我所看到的 enter image description here

,如果你想浮红色框的左边一路;

再加入logo2013直属banner2013

它将创建这个

enter image description here

UPDATE

我觉得你的问题是在左上角的边界半径。这应该解决它。

它添加到.greybanner2013

border-top-left-radius:10px;

具有边框半径等,其可以覆盖有背后的灰色区域,你放在那里的标志。 实际上浮动红色框左侧并保持正确,同时保持他们在屏幕中间需要更多的工作,可能更改html和css相当多。

您可以将logo2013类的背景颜色设置为white,这也会产生类似的效果。