Open
Description
Given the following HTML:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="base.css">
</head>
<body>
<label type="toggle-button">
<input type="radio" name="elementx">
Hello
</label>
</body>
</html>
And the following CSS:
label[type="toggle-button"] {
border: 1px solid white;
color: white;
display: inline-block;
margin: 0;
padding: 16px;
}
label[type="toggle-button"] > input[type="radio"] {
display: none;
}
The <input>
should not be displayed (and thus not affecting the layout of the parent <label>
), but it seems to be affecting layout:
In fact you can change the properties of the display: none;
input, for example:
label[type="toggle-button"] > input[type="radio"] {
display: none;
padding: 64px;
margin: 64px;
}
This renders as:
(This might be an issue in jStyleParser, not sure)
EDIT: An ugly workaround is to set the margin/padding to negative values:
label[type="toggle-button"] > input[type="radio"] {
display: none;
padding: -10px;
margin: -10px;
}
Metadata
Metadata
Assignees
Labels
No labels