Replace or add code to HTML with CSS -
it's challenge , not sure if that's possible here problem:
i don't have full access website. can edit external css.
menu code:
<ul id="navprimary" class="nav"> <li id="navlink1"><a href="#">link1</a></li> </ul>
i want add first position on list:
<li id="navhome"><a href="/"><i class="icon-home"></i></a></li>
i can ask system administrator add link home code this:
<li id="navhome"><a href="/">home</a></li>
so there still problem replacing text home
<i class="icon-home"></i>
.
the thing comes mind regarding css :before
, :after
, content
not quite sure how use it. before i've tried adding single word.
edit1
i have tired this:
#navlink1:before{ content:'<li id="navhome"><a href="/"><i class="icon-home"></i></a></li>'; }
but added html code text.
if want without using pseudo elements can hide link text , add icon background. remove text do
display: inline-block; /* or block */ overflow: hidden; text-indent: 100%; white-space: nowrap;
then add background image, sample:
http://codepen.io/anon/pen/voymoq
this still requires admin add link in you.
Comments
Post a Comment