Created
December 17, 2013 20:10
-
-
Save exarcheia-web/8011742 to your computer and use it in GitHub Desktop.
Position fixed demo
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* Position fixed demo */ | |
| .article-main { | |
| padding-top: 40px; | |
| } | |
| .box { | |
| background: hotpink; | |
| width: 100%; | |
| height: 43px; | |
| box-shadow: 0 3px 18px #222; | |
| position: fixed; | |
| left: 0; | |
| top: 0; | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="box"></div> | |
| <article class="article-main"> | |
| <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam, expedita ipsam ex facilis nesciunt neque sapiente molestiae a eligendi pariatur quis minima aliquid officiis. Quis, quibusdam, aliquid nobis autem incidunt expedita distinctio magnam aliquam tempora quos deleniti corrupti pariatur omnis porro assumenda qui perferendis neque repellat debitis sed non ratione.</p> | |
| <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam, expedita ipsam ex facilis nesciunt neque sapiente molestiae a eligendi pariatur quis minima aliquid officiis. Quis, quibusdam, aliquid nobis autem incidunt expedita distinctio magnam aliquam tempora quos deleniti corrupti pariatur omnis porro assumenda qui perferendis neque repellat debitis sed non ratione.</p> | |
| <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam, expedita ipsam ex facilis nesciunt neque sapiente molestiae a eligendi pariatur quis minima aliquid officiis. Quis, quibusdam, aliquid nobis autem incidunt expedita distinctio magnam aliquam tempora quos deleniti corrupti pariatur omnis porro assumenda qui perferendis neque repellat debitis sed non ratione.</p> | |
| <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam, expedita ipsam ex facilis nesciunt neque sapiente molestiae a eligendi pariatur quis minima aliquid officiis. Quis, quibusdam, aliquid nobis autem incidunt expedita distinctio magnam aliquam tempora quos deleniti corrupti pariatur omnis porro assumenda qui perferendis neque repellat debitis sed non ratione.</p> | |
| <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam, expedita ipsam ex facilis nesciunt neque sapiente molestiae a eligendi pariatur quis minima aliquid officiis. Quis, quibusdam, aliquid nobis autem incidunt expedita distinctio magnam aliquam tempora quos deleniti corrupti pariatur omnis porro assumenda qui perferendis neque repellat debitis sed non ratione.</p> | |
| <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quisquam, expedita ipsam ex facilis nesciunt neque sapiente molestiae a eligendi pariatur quis minima aliquid officiis. Quis, quibusdam, aliquid nobis autem incidunt expedita distinctio magnam aliquam tempora quos deleniti corrupti pariatur omnis porro assumenda qui perferendis neque repellat debitis sed non ratione.</p> | |
| </article> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // alert('Hello world!'); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| {"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment