Question

我只是个初学者。我想用html和css制作一个简单的网页。我制作了标题，左侧内容以及正确的内容和页脚。

在左边的内容中，我想写一些正常的描述性文字。我使用ul使用了li和text-align:justify标记。但问题是：文本超出了页面的正确内容。我希望他们在一条新线上，而不是在右边。我现在该怎么办？

这是HTML：

<body>
<div id="header"></div>

<div id="wrap">
    <div id="left">
        <div id="left_content">
            <ul><li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy   nibh commodo consequat.</li></ul>
            <a href="#"> Read More</a>

            <ul><li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh commodo consequat.</li></ul>
            <a href="#"> Read More</a>
        </div>
    </div>

    <div id="right">
        <div id="right_content"></div>
    </div>
</div>

<div id="footer"></div>
</body>

和css代码：

#left_content ul li {
padding:10px 0 0 0px;
font:Tahoma, Geneva, sans-serif;
font-size:11px;
color:#000000;
font-weight:bold;
text-align:justify;
}

Answer 1

为什么不给li一个明确的宽度？

#left_content ul li {
    padding:10px 0 0 0px;
    font:Tahoma, Geneva, sans-serif;
    font-size:11px;
    color:#000000;
    font-weight:bold;
    width: 100px;
}

这是fiddle

Answer 2

我会给你的#left_content宽度

#left_content{
    width:200px;
}

示例： http://jsfiddle.net/jasongennaro/p3ApG/

在固定位置写文本的问题

2 个答案: