diff --git a/printPreview.css b/printPreview.css index 41b2474..3bf31d5 100644 --- a/printPreview.css +++ b/printPreview.css @@ -106,43 +106,51 @@ border: 1px solid #5689db; color: #fff; } +label { + display: block; + margin-left: 10px; + margin-right: 10px; + float:left; +} + +label[for] { + cursor: pointer; +} .checkbox { + position: relative; + width: auto; + height: auto; +} +.checkbox input[type=checkbox] + label { + margin: 0px; position: relative; width: 20px; height: 20px; -} -.checkbox label { - cursor: pointer; - position: absolute; - top: 0; - width: 100%; - height: 100%; border-radius: 4px; background-color: #DEDEDE; border: 1px solid #D4D4D4; } -.checkbox label::after { - opacity: 0; - content: ''; - position: absolute; - width: 9px; - height: 5px; - background: transparent; - top: 4px; - left: 4px; - border: 3px solid #333; - border-top: none; - border-right: none; - - transform: rotate(-45deg); +.checkbox input[type=checkbox] + label::after { + opacity: 0; + content: ''; + position: absolute; + width: 9px; + height: 5px; + background: transparent; + top: 4px; + left: 4px; + border: 3px solid #333; + border-top: none; + border-right: none; + transform: rotate(-45deg); } -.checkbox label:hover::after { - opacity: 0.5 !important; + +.checkbox input[type=checkbox] + label:hover::after { + opacity: 0.5 !important; } .checkbox input[type=checkbox]:checked + label::after { - opacity: 1; + opacity: 1; } - .numberInput input[type=number]{ font-size:1em; width:1.5em; diff --git a/printPreview.html b/printPreview.html index d2547d9..f7ad45d 100644 --- a/printPreview.html +++ b/printPreview.html @@ -24,10 +24,11 @@ - +
+