I have a form where depending on the website's brand one of two input fields should be visible at one given spot.
I figured I just put both input fields in the same container and then through my stylesheet set one of them to display:none; This does hide the field, but it still makes it take up space. I also tried setting the height and width to 0 or setting visibility to hidden or collapse but none of those worked.
Untill now all the branding things could be done with css style sheets so I would like to keep it that way. The solution should at least be supported in IE6 & up, Firefox 2 & up and Chrome (latest).
The visibility CSS property shows or hides an element without changing the layout of a document. The property can also hide rows or columns in a <table> .
display: none; is your best solution if you just wanna hide the field.
why don't you use input type="hidden"
?
What about setting the invisible input field to position: absolute;
which should take it out of the rendering flow.
However, setting it to display: none
should in theory do the same...
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With