
Hello, I was wondering if it was possible to strip whitespace from between input/span navbar elements. Simply put I have used the navigation bar code to create show/hide section buttons. As shown in the image below. When the associated <div></div> section is collapsed there is an extra whitespace area between the 'buttons'. I would like to strip that out. The css code used is: /* Section Showhide Buttons */
div[class^="sheet-sect-sh-"] {
display: none;
}
input.sheet-sect-shtab0:checked ~ div.sheet-sect-sh-test,
input.sheet-sect-shtab1:checked ~ div.sheet-sect-sh-defabil,
input.sheet-sect-shtab2:checked ~ div.sheet-sect-sh-saves,
input.sheet-sect-shtab3:checked ~ div.sheet-sect-sh-attacks {
display: block;
}
input.sheet-sect-shtab99:checked ~ div[class^="sheet-sect-sh-"] {
display: block;
margin-top: -35px !important;
}
input.sheet-sect-shtab0:checked ~ span.sheet-sect-shtab0,
input.sheet-sect-shtab1:checked ~ span.sheet-sect-shtab1,
input.sheet-sect-shtab2:checked ~ span.sheet-sect-shtab2,
input.sheet-sect-shtab3:checked ~ span.sheet-sect-shtab3,
input.sheet-sect-shtab99:checked ~ span.sheet-sect-shtab99 { /* Show ALL */
background: rgb(0,158,115);
border-radius: 4px;
}
input.sheet-sect-shLong {
border: 0px solid black !important;
width: 99%;
height: 19px;
cursor: pointer;
position: relative;
top: 22px;
margin-top: -40px;
margin-left: 3px;
opacity: 100; /* This sets the visibility of the checkbox */
z-index: 9999;
}
span.sheet-sect-shLong { /* Show/Hide Buttons */
text-align: center;
border: 1px solid black;
display: inline-block;
font-size: 13px;
background: rgb(47, 79, 79);
color: white;
font-weight: bold;
border-radius: 4px;
width: 99%;
height: 20px;
cursor: pointer;
position: relative;
top: -17px;
margin-left: 4px;
}