How to make a blurry background using CSS

Asked Dec 08 '13 at 09:32

Active Dec 08 '13 at 10:20

Viewed 643 times

hi i have a div which acts as a navbar and is positioned at the top of my page, with a z-index , fixed position and all, i want that the text and other content that comes underneath during scroll is blurry but i dont know how to do this please help my current code is -

.cbp-fbscroller > nav {
    z-index: 9999;
    position: fixed;
    left: 0px;
    height: 10%;
    background: ???;
    top: 90%;
    width: 100%;}

.cbp-fbscroller > nav a {
    display: block;
    position: relative;
    z-index: 9999;
    margin-top: 25px;
    float: right;
    text-transform: uppercase;
    color: #fff;
    margin-right: 70px;
    -webkit-transition: all 0.2s ease-in-out;
    border-bottom: 0px solid #fff;
    border-top: 0px solid #fff;
    padding-bottom: 15px;
}

edited Dec 08 '13 at 10:20

asked Dec 08 '13 at 09:32

user2906766

can you create a [fiddle](http://jsfiddle.net) ? – Mohsen Safari Dec 08 '13 at 09:34
1

Check this out: http://css-tricks.com/fun-with-blurred-text/ – Jrn Dec 08 '13 at 09:41
look here: http://stackoverflow.com/questions/17034485/ios-7s-blurred-overlay-effect-using-css – toast Dec 08 '13 at 12:12

How to make a blurry background using CSS

0 Answers0