Padding doesn't get displayed
If width of a viewport is set to 1024px and if I create the following html docume开发者_如何学运维nt:
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<style type="text/css">
p
{
background-color:blue;
padding:0px 250px;
margin:0px 250px;
overflow:scroll;
}
</style>
</head>
<body>
<p>
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
</p>
</body>
</html>
then I would expect that ( due to p element providing horizontal scroll bars ) padding on both sides of p element would still be 250px in size . But while padding on left side of p element is still 250px, padding on right side equals zero pixels?
What is the reason for such behavior? Is it because only text can be clipped (and viewed with the help of scroll bars), while if padding is clipped, then it simply doesn’t get rendered?
thanx
Padding can be problematic on browsers. Some push the edge of the element out while others push the content in (which is what I suspect you're expecting). You will have a way easier time by setting the margin to achieve the same effect.
加载中,请稍侯......
精彩评论