If width of a viewport is set to 1024px and if I create the following html document:
<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