css - Keep an image centered regardless of screen size? -


here's fiddle created. want decorative ornament stay in middle of screen. can't figure out how it. tried wrapping in div didn't work either.

html

<span class="border-top"></span> 

css

.border-top { background: url("http://i.imgur.com/txoi4sd.png") no-repeat; clear: both; display: block; height: 47px; margin-bottom: 50px; width: 100%; } 

.border-top {      background: url("http://i.imgur.com/txoi4sd.png") center center no-repeat;      clear: both;      display: block;      height: 47px;      margin-bottom: 50px;      width: 100%;  }
<span class="border-top"></span>

this trick.

reference: http://www.w3.org/tr/css3-background/#the-background


Comments

Popular posts from this blog

javascript - How to synchronize the Three.js and HTML/SVG coordinate systems (especially w.r.t. the y-axis)? -

javascript - How do I find how many occurences are there of a highlighted string, and which occurence is it? -

java - Reading data from multiple zip files and combining them to one -