左右缩进文本

Question

左右缩进文本

我使用以下方法p tag在同一行上左右对齐文本:

.left
{
    float: left;
    text-indent: 5px;
    margin-top: 0px;
}

.right
{
    float: right;
    text-indent: 5px;
    margin-top: 0px;
}

<div id="content">

    <p class="left">Left Text </p>

    <p class="right">Right Text </p>

</div>

Run Code Online (Sandbox Code Playgroud)

左侧文本将缩进5个像素,右侧文本不缩进.我试过-5px和5px,任何想法我怎么能做到这一点？

谢谢

Answer 1

Sar*_*raz 7

你可以使用margin-left而margin-right不是.或者padding-left,padding-right取决于您所需的输出/要求.

Answer 2

小智 6

这应该工作

<html>
    <head>
    <style type="text/css">
    .left
    {
        float: left;
        margin-left: 50px;
    }

    .right
    {
        float: right;
        margin-right: 50px;
    }
    #content
    {
    }
    </style>
    </head>

    <body>

    <div id="content">

        <div class="left">Left Text </div>

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

    </div>

    </body>
    </html>

Run Code Online (Sandbox Code Playgroud)

归档时间：	15 年，10 月前
查看次数：	26078 次
最近记录：	15 年，10 月前