More actions
(Created page with "div.tabdiv { position: relative; } div.tabdiv > ul { display: block; position: relative; } div.tabdiv > ul > li { display: inline-block; position: relative...") |
m (add a class for hiding tabs from view and for js to know to skip them) |
||
Line 84: | Line 84: | ||
div.tabdiv > ul > li.active a { | div.tabdiv > ul > li.active a { | ||
color:black | color:black | ||
} | |||
div.tabdiv > ul > .hidden { | |||
visibility:hidden; /* hide from screen readers */ | |||
display:none; /* hide from visible page */ | |||
} | } |
Revision as of 00:45, 17 June 2020
div.tabdiv {
position: relative;
}
div.tabdiv > ul {
display: block;
position: relative;
}
div.tabdiv > ul > li {
display: inline-block;
position: relative;
}
div.tabdiv > ul > li > a {
position: relative;
}
div.tabdiv > div {
position: relative;
}
/** Vector **/
div.tabdiv {
display: flex;
}
div.tabdiv > div {
flex: 1;
}
div.tabdiv div.tabdiv:not(.forceport),
table.infobox div.tabdiv:not(.forceport),
div.tabdiv.forceland {
display: block;
}
div.tabdiv div.tabdiv:not(.forceport) > ul,
table.infobox div.tabdiv:not(.forceport) > ul,
div.tabdiv.forceland > ul {
border-right: none;
}
div.tabdiv div.tabdiv:not(.forceport) > ul > li,
table.infobox div.tabdiv:not(.forceport) > ul > li,
div.tabdiv.forceland > ul > li {
display: inline-block;
margin: 0 2px;
}
div.tabdiv > div {
padding: 10px;
}
div.tabdiv > ul {
margin: 0;
font-weight: bold;
}
div.tabdiv > ul > li {
display: block;
margin: 5px 0;
padding: 0 20px;
height: 32px;
line-height: 32px;
border-radius:5px;
border:1px solid;
}
div.tabdiv > ul > li a {
text-decoration: none;
}
div.tabdiv > ul > li:hover {
background-color: #c4a645;
color:black;
}
div.tabdiv > ul > li.active {
background-color: #f1df74;
}
div.tabdiv > ul > li.active a {
color:black
}
div.tabdiv > ul > .hidden {
visibility:hidden; /* hide from screen readers */
display:none; /* hide from visible page */
}