如何填充到左，右增加後的內容和僞元素之前

我想添加填充到左和之前的內容屬性的值權，僞元素之後..如何填充到左，右增加後的內容和僞元素之前

HTML是 -

<div class="header-contact"> 
    <p>Mail: [email protected]</p> 
    <p>Tel: xxxxx xxxxxxxx</p> 
</div>

和CSS是 -

.header-contact p{ 
    float:right; 
    padding-left:10px; 
    position:relative; 
} 
.header-contact p:last-child:after{ 

    content:"|"; //i want to add padding to its right and left 

    position:absolutes; 
}

來源

2015-05-23 shahid hasan

不知道這是否是你想要的。您需要僞元素上應用display:block或display:inline-block屬性，它與填充渲染：

.header-contact p:last-child:after{ 
    content:"|"; 
    padding:0 10px; 
    display:inline-block; 
}

JSFIDDLE

來源

2015-05-23 19:02:18

感謝它正在工作..這是我的第一個問題，我很高興能在幾分鐘內得到答案。 –

-1

你可以試試這個：

.header-contact p{ 
 
float: right; 
 
} 
 
.separator{ 
 
    padding: 0 10px; 
 
}

<div class="header-contact"> 
 
    <p>Mail: [email protected]</p> 
 
    <p>Tel: xxxxx xxxxxxxx</p> 
 
</div>

Working code

來源

2015-05-23 19:15:02

如何填充到左，右增加後的內容和僞元素之前

回答

相關問題