html - li breadcrumb image positioning error -


i've got following menu.

<ul> <li><img src="images/item_grp_nav_img.jpg" alt="nav-image">home</li> <li>menu type</li> <li>menu type</li> <li>menu type</li> </ul> 

the css goes following.

#item-group-navigation{ height: 30px; background-color:#949698; min-width:760px; }  #item-group-navigation ul{ height: 100%; width: 30%; padding: 0px 0px 0px 15px; margin: 0px; }  #item-group-navigation li{ float: left; list-style: none; display: block; padding: 3px 6px 0px 5px; color: white; font-size: 18px; font-family:myriadproreg; }  #item-group-navigation li:first-child:before{ content:none; }  #item-group-navigation li:before{ display: block; width: 20px; height: 30px; content: url('../images/list_arrow.jpg'); float: left; }  #item-group-navigation img{ float: left; } 

the issue displayed on following image.

issue

how can fix issue using css. please me. thank you.

i've found issue! i've defined height & width shouldn't be! 1 who's going through it!


Comments

Popular posts from this blog

asp.net mvc 3 - Using mvc3, I need to add a username/password to the sql connection string at runtime -

kineticjs - draw multiple lines and delete individual line -

thumbnails - jQuery image rotate on hover -