html - li and a element styling issue with Chrome after clicking a link -


i have simple menu works fine in firefox, when using chrome links move around when click on them , breaks styling. read somewhere display: block; on a element fix this, didn't.

you can see demo here: https://jsfiddle.net/dewg1l8y/1/ use chrome , click links see mean.

also idea how remove text wrapping in chrome? stays on 1 line in firefox.

html:

<ul>     <li>         <a href="#">link 1</a>     </li>     <li>         <a href="#">second link</a>     </li>     <li>         <a href="#">3</a>     </li> </ul> 

css:

li {     display: inline-block;     list-style: none; }  {     display: block;     color: #000;     padding: 0 10% 0 10%;     text-decoration: none; } 

just change padding 10% 10px or more tag


Comments

Popular posts from this blog

javascript - oscilloscope of speaker input stops rendering after a few seconds -

javascript - gulp-nodemon - nodejs restart after file change - Error: listen EADDRINUSE events.js:85 -

Fatal Python error: Py_Initialize: unable to load the file system codec. ImportError: No module named 'encodings' -