A free library of HTML, CSS, JS

Search This Blog

Thursday, 15 September 2016

Clip Image

.container {
  position: relative;
#clip {
  position: absolute;
  clip: rect(0, 300px, 200px, 0);
  /* clip: shape(top, right, bottom, left); NB 'rect' is the only available option */
    height: 150px;
    overflow: hidden;

.siteHeader .siteLogo{
    margin: -0px;
<div class="container">
  <img src="cooking3.jpg" width="400"/>
<div class="container">
  <img id="clip" src="cooking3.jpg" width="400"/>
<header class="siteHeader">
    <img src="taskbob/images/1.jpg" class="siteLogo" />

No comments :

Post a Comment