Hiding the inner panel partially using html css

Question

Hi all, My markup looks like this :

<div class='container' style='margin:10em'>
<div class='content'><p>some content here !</p></div>
</div>

Now I want to hide '.content' partially, that is imagine it to be shifted half way left side, and the other half should be visible and not the left half.

Answer 1

Try this:

.container { overflow:hidden; }
.content { margin-left:-50px; } /* or any amount you want*/

Edit: margin should be -50px to hide left side.