html - divider with icon in the center won't span width of div -


this question has answer here:

i trying divide part of page , center icon between 2 divider lines. figure have use ::before , ::after, wrote this

jsfiddle.net

i:after {     background-color: #999;     content: " ";     display: inline-block;     height: 3px;     margin: 0 0 8px 20px;     text-shadow: none;     width: 100%; }  i:before {     background-color: #999;     content: " ";     display: inline-block;     height: 3px;     margin: 0 20px 8px 0;     text-shadow: none;     width: 100%; } 

in jsfiddle doesn't seem work @ all. when open index file in chrome works point. show line left , right of icon, won't have fill whole body div. ideas great.

if u use font-awesome u can add icon in menu

this example :

<li><i class="fa fa-home"></i>home</li> <li><i class="fa fa-about"></i>about</li> <li><i class="fa fa-contact"></i>contact</li> 

i see file on jsfiddle..

more font-awesome can see on this..

http://fontawesome.io/


Comments

Popular posts from this blog

amazon web services - S3 Pre-signed POST validate file type? -

c# - Check Keyboard Input Winforms -