Question

嘿，伙计们，我有这个问题，当我在文本中心对齐时，我正在放置和

，并且它在每个文本之间保持跳转对齐

这就是它的样子：

<div id="footercont">
                <a href="#"> A propos de So Home </a><p>I</p>
                <a href="#"> FAQ </a><p>I</p>
                <a href="#"> Contact </a><p>I</p>
                <a href="#"> Parrainage </a><p>I</p>
                <br>
                <a href="#"> Plan du site </a><p>I</p>
                <a href="#"> Conditions générales de vente </a><p>I</p>
                <a href="#"> Données personnelles </a><p>I</p>
                <a href="#"> Parrainage </a>
            </div>

这就是我希望它看起来像：提议de So Home I FAQ I Contact I Parrainage Plan du site I条件généralesdeventeIDonnées人员

这是css代码：

div#footercont{
    margin: 0;
    width: 980px;
    height: 196px;
    position:relative;
    float:left;
    left: 50%;
    margin-left: -490px;
    background: rgb(248,248,248);
    text-align: center;
}

div#footercont a{
    font-family: Arial;
    font-size: 12px;
    color: rgb(187,189,188);
    text-decoration:none;
    text-align: center;
    padding: 0px 8px 0px 8px;
}

div#footercont p{
    font-family: Arial;
    font-size: 12px;
    color: rgb(187,189,188);
    text-decoration:none;
    text-align: center;
    margin: 0px;
    white-space: nowrap;
}

真的很想在这件事上得到一些帮助，谢谢！

Answer 1

p是一个块级元素，因此占用了100％的水平空间，因此您需要将其设为display: inline-block;或display: inline;

但我不确定你为什么需要p，我认为你想要单独定位该文本，所以为了达到这个目的，你应该考虑使用span元素而不是inline元素1}}元素，如a。

Answer 2

如果您正在使用css3并希望在每个项目之间使用分隔符，请删除不需要的段落标记并尝试下面的css

#footercont a:after {
    content: "|";
    padding-left:8px;
}
#footercont a:last-child:after {
    content: "";
}

Working Demo

放<a> and <p> in one line when text is centrally align</p></a>

2 个答案: