html - 使用css在侧栏中的div垂直内的div

Question

我有一个页面，我需要一个左侧栏，该栏在该栏下包含一个标题，该图像下的图像，该列表下的文本我该怎么做我尝试了相对位置和绝对位置，但它不起作用

我需要的是 div 内的 div 意味着左侧栏是一个 div，其中包括标题、图像、文本、列表。

谁能帮我 ？？？？？

这就是我试图对图像做的事情

.leftsideBar h2 {
    padding: 0px 0px 30px 0px;
    letter-spacing: -1px;
    font-size: 2em;
}
.leftsideBar {
    float: left;
    width: 290px;
    padding: 0px 0px 20px 0px;
    border:5px solid #FF0000;
    position:relative;

}
#profileImage{
    position:absolute;
    top:40px;
    border:5px solid #0000FF;
}

Answer 1

这是你想要实现的 小提琴吗？

html:

    <div class="leftsideBar">
        <h2>title</h2>
        <img src="" height="100" width="100"/>
        <ul>
            <li>test1</li>
            <li>test1</li>
            <li>test1</li>
            <li>test1</li>
        </ul>
    </div>

CSS：

.leftsideBar h2 {
    padding: 0px 0px 30px 0px;
    letter-spacing: -1px;
    font-size: 2em;
}
.leftsideBar {
    float: left;
    width: 290px;
    padding: 0px 0px 20px 0px;
    border:5px solid #FF0000;
    position:relative;
}
#profileImage{
    border:5px solid #0000FF;
}

这是图像旁边的文本的另一个选项-> fiddle2