1

I want to achieve the following effect using HTML & CSS:


Printscreen

enter image description here


However, I'm not sure if I'm doing it correctly.
The current state is the following:

<div class="post"><!-- Posts are just divs with a white background -->
    <div class="post-header">
        <div class="left">Som Text</div>

        <div class="center">
            <img src="pseudo" class="center" />
        </div>

        <div class="right">Som Text</div>
    </div>

    <p class="title">Som Text</p>
</div>

Then, I'm simply doing a margin-top:-66px; on div.post div.post-header.
This is probably not what one should do.

Can you give me an idea on how to approach this?

4

3 回答 3

2

您也可以尝试与位置相关的事情,为此将post课程position:relative和其他课程position:absolute设置为您想要的位置

于 2013-01-21T10:32:50.983 回答
1

打印屏幕或只是 margin-top 属性不会有任何好处,因为屏幕截图也不会显示在这里。你能给我链接以查看页面的实时预览吗

于 2013-01-21T10:28:21.480 回答
0

我在我的网站上做了类似的事情。欢迎访问http://robertfauver.com/

于 2013-01-23T17:28:13.133 回答