CSS cropping

crop crop crop

by Alex Yu

HTML

<span>This is 480 x 200</span>
<div class="box480x200"></div>
<span>This is 1020 x 320</span>
<div class="box1020x320"></div>

CSS

.box480x200{
  border: 1px solid black;
  height: 200px;
  width: 480px;
  background-image: url('http://uavlab.spyd.com/sites/default/files/banner/smith-winter-sunset.png');
  background-position:center;
  background-size:cover;
}

.box1020x320{
  border: 1px solid black;
  height: 320px;
  width: 1020px;
  background-image: url('http://uavlab.spyd.com/sites/default/files/banner/smith-winter-sunset.png');
}