html - Add text to empty label in div without adding height to div -
The problem is that there are some inputs between the CSS line from the separator, they are all vertical, and labeled below the input.
The problem is that when there is a verification error, some text is kept inside this label, which makes it visible, it makes the div bigger and the container gives the height to the divas, So the input is no longer aligned vertically.
Is there a way that the label already has a different height than zero when there is no text?
Is this help? Jsfiddle:
Approach 1 In this solution, a fixed height is given according to the labeled cart size of the label.
html
& Lt; / Div & gt; & Lt; Div id = "labDiv" & gt; & Lt; Label id = "laboratory" & gt; & Lt; / Label & gt; & Lt; / Div & gt; & Lt; Div & gt; & Lt; Input type = "button" value = "show content in label" id = "showLab" /> & Lt; / Div & gt;
CSS
#labDiv {height: 18px; } Approach 2 In this approach, the label is read: a space character - & amp; Nbsp;
The actual height to achieve it, as in the text. JS Bellass:
html
& lt; Div & gt; ; & Lt; Input type = "text" id = "txt" value = "label content" /> & Lt; / Div & gt; & Lt; Div & gt; & Lt; Label id = "laboratory" & gt; & Amp; Nbsp; & Lt; / Label & gt; & Lt; / Div & gt; & Lt; Div & gt; & Lt; Input type = "button" value = "show content in label" id = "showLab" /> & Lt; / Div & gt; Quick implementation of
approach 2 :
If you have a normal class for all such labels, you can You can use:
to quickly add a location to CSS.
If there is a square: error label
.errorLabels :: {content: "before \ 00a0"; }
Comments
Post a Comment