用BG-Color设置P元素的宽度，以自动对文本长度进行自动效果

Question

我的P元素具有定义的背景颜色，该元素应自动适应其内部文本。我尝试将宽度设置为自动，但是P元素仍然跨越了100％，如定义的背景颜色可见。

如何获得相应调整的宽度，而无需每次设置％或PX宽度？

代码：

#job-xyz.titel {
    background-color: #dceff5;
    font-size:17px;
    color:black;
    text-align: left;
    margin-top:0px;
    padding-left:10px;
    margin-left:45px;
    width:auto;
}
<div class="header2">
<p class="titel"><strong>Linux Softwaree</strong></p>
</div>

Answer 1

设置等于内容的宽度，使用display:inline-block

#job-xyz.titel {
    background-color: #dceff5;
    font-size:17px;
    color:black;
    text-align: left;
    margin-top:0px;
    padding-left:10px;
    margin-left:45px;
    width:auto;
    display:inline-block /*added*/
}

也 #job-xyz.titel
应该是
.header2 > p.titel

您的代码演示和工作演示

最终使用CSS

Answer 2

<p>是一个块元素，必须通过CSS中的" display"属性设置为内联。

通过" noobeditor"校正代码

#job-xyz.titel {
    background-color: #dceff5;
    font-size:17px;
    color:black;
    text-align: left;
    margin-top:0px;
    padding-left:10px;
    margin-left:45px;
    width:auto;
    display:inline-block /*added*/
}