Hello Philip, On 2017-03-22 09:03:02 Philip Taylor hacked into the keyboard: > But can you not, as others have suggested, round the corners of > #pageHeadLeft (i.e., the container) and set "overflow: none" so that > the portion(s) of the background image that protrude beyond the > rounded corners of the container are invisible ?
This is waht I have tried and did not work, but I think, the problem is
the "padding" arround the image inside the "pageHead"
<style>
#pageHeadLeft {
background-image: url('michelle.jpg');
padding-left: 30px;
}
#imageHeadRight {
border-radius: 25%;
padding-left: 30px;
}
</style>
<div id="pageBody">
<div id="pageHeadLeft">
</div>
<div id="pageHeadCenter">
text area
</div>
<div id="pageHeadRight">
<img src="michelle.jpg" class="imageHeadRight">
</div>
</div>
where the Head left/right have a fixed width of 180px and the HeadCenter
is dynamic. Both pictures are placed correctly. However, I get only
the HeadRight one round. Do you suggest, I should add another <div> for
the background-image?
> Philip Taylor
Thanks
Michelle
--
Michelle Konzack Miila ITSystems @ TDnet
GNU/Linux Developer 00372-54541400
signature.asc
Description: Digital signature
______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
