我需要在文章的段落旁边放置一些座右铭。
HTML代码如:
答案 0 :(得分:0)
我查看了您的图片,看起来这是您元素顺序的问题。您应该将标记放在块上方,使其保持在正在运行的段落之上。
如果您想强制使用顶部位置,可以使用
position:absolute;
right:0;
margin: auto;
您可以使用顶部的负边距或正边距来向上或向下推动元素,使其保持相对于DOM中的位置。这将是为了避免固定的像素定位。
答案 1 :(得分:0)
一个简单的解决方案就是将aside
移到顶部,就像img旁边一样:
<section>
<header>..</header>
<img ..>
<aside>...</aside>
<article>
<p> ..</p>
<p> ..</p>
<p> ..</p>
</article>
</section>
演示http://jsfiddle.net/wa0Lcad3/
如果您需要aside
出现在段落的中间,则应将其移入其中。
答案 2 :(得分:0)
<section>
<header>..</header>
<img ..>
<aside>...</aside>
<p> ..</p>
<p> ..</p>
<p> ..</p>
</section>
Css for this
section
{
white-space: normal;
display: block;
width: 100%;
}
img
{
float: left;
padding-right: 10px;
display: inline-block;
line-height: 24px;
}
aside
{
float: right;
padding-left: 10px;
}