漂浮的元素没有正确漂浮

我有一些漂浮在一起的图像。我想要一个用户点击一个元素（在这种情况下点击“生物”按钮“）打开一个新的文本，将浮动在图像旁边的div。漂浮的元素没有正确漂浮

我知道这可以在像理论在此间表示：http://jsfiddle.net/MGDTech/waq7x/1/

li {display: block; float:left; background: #eee; margin: 20px; height: 80px; width: 80px;} 
li.hide {display: none;}

但是，当我在我的测试版WordPress站点实现它，它不工作，文本浮动图像下方

下面是实际的代码：http://jsfiddle.net/MGDTech/GT36x/

.bio-button {font-family: "Open Sans", sans-serif; font-weight: 600; font-size: 10px; letter-spacing: 1.5px; background: #fff; color: #2d2d2d; width: 44px; text-align: center; padding: 0px 0px 0px 3px; position: relative; top: -125px; z-index: 10; cursor: pointer; margin-top: 360px;} 
.bio-button:hover {opacity: 0.5; zoom: 1; filter: alpha(opacity=50);} 
.team-member {float: left; margin-right: 40px; } 
.team-member .close {float: right;} 
.team-member img {opacity: 0.5; zoom: 1; filter: alpha(opacity=50);} 
.team-member img:hover {opacity: 1; zoom: 1; filter: alpha(opacity=100);} 
.team-member h2, .team-member p, .team-member .bio-button {margin-left: 22px;} 
.team-member h2 {font-size: 11px; font-weight: 300; line-height: 15px;text-transform: uppercase; color: #737373; letter-spacing: 2px; -webkit-text-stroke-width: 1px;} 
.team-photo p {font-size: 11px; font-weight: 300; line-height: 15px;text-transform: none; color: #737373; padding-top: 5px; -webkit-text-stroke-width: 1px;} 
.team-photo {float:left; width: 50%;} 
.team-text {display: none;float: left; width: 50%; height: auto; padding: 25px 0px 0px 0px; font-size: 12px; }

我在做什么错了？

来源

2013-02-27 MGDTech

css和divs很棘手。

上面描述的将div.team文本移动到div.team照片之前所描述问题的简单解决方案。这会为关闭按钮造成一个问题 - 我会在div.team-photo中移动一个。

来源

2013-02-27 16:41:37 fredrik

谢谢Fredrik。这是朝着正确方向迈出的一步！我知道这很简单！我仍然遇到与尺寸有关的问题，但我可以弄清楚。 – MGDTech 2013-02-27 18:13:15

漂浮的元素没有正确漂浮

回答

相关问题