CSS svg color transition error in Chrome -
i have menu in css icons svg. when mouse on button, change color of icon via css transition. interestingly, not buttons work. depends on content of href. why?
this works:
<li class="navbutton"> <a id="home" href="home.php"> <span class="icon"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="30px" height="30px" viewbox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve"> <path class="icon_path" fill="white" d="m256,69.972l50,275.815h42.507v166.213h326.985v275.815h462l256,69.972z m374.492,397.028h-73.767v-86.495 h-89.451v86.495h-73.768v251.99 l256,133.587l118.492,118.402v397.028z"/> </svg> </span> <span class="text">home</span> </a> </li>
this doesn't work:
<li class="navbutton"> <a id="projects" href="projects.php"> <span class="icon"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="30px" height="30px" viewbox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve"> <path class="icon_path" fill="white" d="m436.631,207.445v163.681l279.232,462v298.319l436.631,207.445z m256,258.08l180.201-104.04l256,50 l75.799,154.041l256,258.08z m232.768,298.319l75.369,207.445v163.681l232.768,462v298.319z"/> </svg> </span> <span class="text">projects</span> </a> </li>
if change href content, eg projects2.php works. crazy..
Comments
Post a Comment