pagination - bootstrap3 tabindex change my css style -


I use tabindex = "" for correct output pseudo on my page list. Focus tag but when I set the tabindex = "" to my link, my style is broken. You can check my problem coming to the host's website, in the bottom you see my pageview So, when you click on the page, if the style breaks, how to fix broken styles? Code: HTML

  & lt; Ul class = "endorsement" & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; & Lt; Img src = "img / catalog / ar_lt.png" alt = "rl" /> & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" tabindack = "1" & gt; 1 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" tab index = "2" & gt; 2 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" tab index = "3" & gt; 3 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" tab index = "4" & gt; 4 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" tabindack = "5" & gt; 5 & ​​lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" tabindack = "6" & gt; 6 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" tabindack = "7" & gt; 7 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" tabindack = "8" & gt; 8 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" tabindack = "9" & gt; 9 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" tab index = "10" & gt; 10 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; One class = "more-20" href = "#" tabladack = "11" & gt; 20 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; One class = "plus -30" href = "#" tabindack = "12" & gt; 30 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; One class = "r-rt" href = "#" & gt; & Lt; Img src = "img / catalog / ar_rt.png" alt = "rt" /> gt; & Lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt;  

css

  / * ************************************************************************* **************************************************************************************************** ********* Catalog-endorsement ******************** / .left Endorsement {margin: 32px 0 0 116px; Width: 48 9px; Height: 44px; Border: 1px solid # d4dfe5; Border Bottom: 0; Boundary-radius: 0; } .left.pagination & gt; Li & gt; A, .left.pagination & gt; Li & gt; Duration {boundary: 0; Padding: 11px 0 0 18px; Font-family: "PTSans"; Font-size: 16px; Font-weight: 400; Line-height: 22px; Color: # 7 B878D; Background color: heir; }. Left.pagination & gt; Li & gt; A: hover, left.pagination & gt; Li & gt; A: focus, .left.pagination & gt; Li & gt; Duration: hover, .left.pagination & gt; Li & gt; Span: focus {color: # 000000; Background: heirs; Border: 0; Padding: 11px 0 0 18px; Font-family: "PTSans"; Font-size: 16px; Font-weight: 400; Line-height: 22px; } .left.pagination & gt; Li & gt; One. More-20 {margin-left: 6px; Padding: 11px 0 0 0; } .left.pagination & gt; Li & gt; One. More-30 {margin-left: 6px; Padding: 11px 0 0 0; } .left.pagination & gt; Li: First-child & gt; A, .pagination & gt; Li: First-child & gt; Term {margin: 0 px 4px 0 30px; Padding-top: 9px; } .left.pagination .ar-rt {margin-left: 4px; Padding: 8px 0 18px; }  

that . Left ul.navi li a: hover, left ul li: Focus sets the width to 243px and hence the design is destroyed ( line 621 at style.css < / Code>).

Solution:

Wrong: . Left ul.navi li a: Hover. Left ul li a: Focus

ul -> ul.navi

Good: . Left ul.navi li a: hover, left ul.navi li a: Focus


Comments

Popular posts from this blog

sqlite3 - UPDATE a table from the SELECT of another one -

c# - Showing a SelectedItem's Property -

javascript - Render HTML after each iteration in loop -