What's new
HTML Forums | An HTML and CSS Coding Community

Welcome to HTMLForums; home of web development discussion! Please sign in or register your free account to get involved. Once registered you will be able to connect with other members, send and receive private messages, reply to topics and create your very own. Our registration process is hassle-free and takes no time at all!

why does [style.display = '']' only work with inline css?

nickdclements

Junior Member
If you use 'inline CSS' to hide a div, you can display it with Javascript.
HTML:
<a href="#" onClick="document.getElementById('mydiv').style.display = '';">show</a>
<div id="mydiv" style="width:100px; height:100px; border:dashed 1px #FF6600; display:none;">
</div>

If you hide it with a 'CSS class/ID Selector' Javascript will not work to display it.
HTML:
<style type="text/css">
#mydiv {display:none;}
</style>
<a href="#" onClick="document.getElementById('mydiv').style.display = '';">show</a>
<div id="mydiv" style="width:100px; height:100px; border:dashed 1px #FF6600;">
</div>

I suppose I can see/understand why... all the same is there any way around it?

Thank you!
 
Back
Top