0

我的文字似乎不想进入这部分文字的下方！ http://prntscr.com/1x2zju

无论我们多么努力地试图让它低于它，它都不会低于它。

.avatar {
  float: left;
  width: 35px;
  height: 35px;
  border: 1px solid #000;
}

.name {
  color: #3B63DB;
  font-size: 15px;
  margin-top: 0;
  float: left;
  padding-left: 5px;
}

.text {
  font-size: 12px;
  color: #000;
  font-family: Helvetica, 'SEGOEUIL', sans-serif;
  margin-left: 3px;
  float: auto;
}

HTML：

<div id='post'>
<img class='avatar' src='http://cppsgang.com/images/person.png'>
        <p class='name'>Thomas A.</p>
        <p class='text'>Hello there! This is my status update. Unfortunately, it will not go below my name. Is there any way I can put it below my name, or is it stuck like this forever? I have to add more in, blah blah blah, to show you how it eventually breaks apart - just not underneath the name. Thanks for all the help you can give!</p>
        <a href='system/posts/delete.php?id=$row[0]'/><span style='color: red;'>Delete</span></a>

</div>

谢谢！

http://jsfiddle.net/QUFx5/

4

2 回答 2

0

编辑与工作

JSFIDDLE

HTML

<div id='post'>
    <img class='avatar' src='http://lorempixel.com/output/people-q-c-35-35-9.jpg'>
            <p class='name'>Thomas A.</p>
            <p class='text'>Hello there! This is my status update. Unfortunately, it will not go below my name. Is there any way I can put it below my name, or is it stuck like this forever? I have to add more in, blah blah blah, to show you how it eventually breaks apart - just not underneath the name. Thanks for all the help you can give!</p>
            <a href='system/posts/delete.php?id=$row[0]'/><span style='color: red;'>Delete</span></a>

    </div>

CSS

.avatar {
  float: left;
  width: 35px;
  height: 35px;
  border: 1px solid #000;
}

.name {
  color: #3B63DB;
  font-size: 15px;
  margin: 0;
  padding-left: 45px;
}

.text {
  font-size: 12px;
  color: #000;
  font-family: Helvetica, 'SEGOEUIL', sans-serif;
  margin-left: 5px;
  padding-left:45px;
  margin:0;
}
于 2013-10-13T17:27:01.063 回答
0

我试过你的 jsfiddle.net。

这件事对我有用：

.avatar {
  float: left;
  width: 50px;
  height: 50px;
  border: 1px solid #000;
}

.name {
  color: #3B63DB;
  font-size: 15px;
  margin-top: 0;
  padding-left: 5px;
}

.text {
  font-size: 12px;
  color: #000;
  font-family: Helvetica, 'SEGOEUIL', sans-serif;
  margin-left: 3px;
}

我已经从名称和文本类中删除了浮点数。此外，将头像的宽度和高度分别增加到 50 像素。

我尝试的新代码可以根据您的要求工作：

.avatar {
  float: left;
  width: 35px;
  height: 35px;
  border: 1px solid #000;
}

.name {
  color: #3B63DB;
  font-size: 15px;

}

.text {
  font-size: 12px;
  color: #000;
  font-family: Helvetica, 'SEGOEUIL', sans-serif;
  margin-top:-15px;
}
于 2013-10-13T17:42:39.560 回答