ultragalga
New Member
I have been coding a mobile website primarily for the iPhone.I am using SVGs for the images, some show up and some don't and I'm not quite sure why.If you see the screenshot below, you can see icons near some of the text, and some with no icons....You can see this bug in action here: https://mobile.hollatme.com/visit that you will notice there is no logo at the top then visit this: https://mobile.hollatme.com/css/svg/logo.svgand go back to the other page.<div class="profileItems"> <a class="notificationsProfileItem" href="javascript:{}" data-loc="notifications">Notifications <span></span></a> <a class="neighborhoodsProfileItem" href="javascript:{}" data-loc="strolling">Strolling <span></span></a> <a class="streamProfileItem" href="javascript:{}" data-loc="stream">Stream <span></span></a> <a class="interestsProfileItem" href="javascript:{}" data-loc="interest-trends">Interest Trends <span></span></a> <a class="photosProfileItem" href="javascript:{}" data-loc="photos">Photos <span></span></a> <a class="shuffleProfileItem" href="javascript:{}" data-loc="shuffle">Shuffle Feeds <span></span></a> <a class="messagesProfileItem" href="javascript:{}" data-loc="messages">Messages <span></span></a> <a class="neighborsProfileItem" href="javascript:{}" data-loc="neighbors">Neighbors <span></span></a> <a class="friendsProfileItem" href="javascript:{}" data-loc="friends">Friends <span></span></a> <a class="settingsProfileItem" href="javascript:{}" data-loc="settings">Settings <span></span></a> </div><!-- End profile items -->.profileItems {}.profileItems a { display:block; background-color:#F2F2F2; margin:0 0 0.1em 0; padding:1.5em 1em 1.5em 2.8em; color:#595959; font-weight:bold; font-size:0.8em; opacity:0;} .profileItems a span { display:block; background:url(svg/goArrow.svg) no-repeat; background-size:1em; float:right; height:1.5em; width:1em; margin:-0.1em 0 0 0; }.shuffleProfileItem { background-image:url(svg/feeds.svg); background-repeat:no-repeat; background-size:1.8em; background-position:0.5em;}.notificationsProfileItem { background-image:url(svg/holla.svg); background-repeat:no-repeat; background-size:1.8em; background-position:0.5em;}.neighborhoodsProfileItem { background-image:url(svg/neighborhoods.svg); background-repeat:no-repeat; background-size:1.8em; background-position:0.5em;}.interestsProfileItem { background-image:url(svg/interests.svg); background-repeat:no-repeat; background-size:1.8em; background-position:0.5em;}.messagesProfileItem { background-image:url(svg/message.svg); background-repeat:no-repeat; background-size:1.8em; background-position:0.5em;}.photosProfileItem { background-image:url(svg/photo.svg); background-repeat:no-repeat; background-size:1.8em; background-position:0.5em;}.neighborsProfileItem { background-image:url(svg/neighbors.svg); background-repeat:no-repeat; background-size:1.8em; background-position:0.5em;}.friendsProfileItem { background-image:url(svg/friends.svg); background-repeat:no-repeat!important; background-size:1.8em; background-position:0.5em;}.settingsProfileItem { background-image:url(svg/settings.svg); background-repeat:no-repeat; background-size:1.8em; background-position:0.5em;}