Search code examples
htmlcssfirebugfirebug-lite

Firebug pale colors in HTML tab - how to show them

How could I somehow show styles for invisible tags showed in Firebug? I have no idea why they are pale/invisible and I need to find out why.

firebug HTML tab

Solution

  • Firebug pales out those elements that are invisible or hidden from view in the browser. According to your example shown here. There are 2 types of HTML elements that are invisible / pale.

    1. <input type="hidden" /> is as the name suggests hidden type and is never shown on the page but can contain some important data for other functionality of the web page.
    2. There is a <div> element which does not contain any content, nor it has its height or width defined. So what do you expect to show for that div?

    EDIT:

    If you want them to be shown on your webpage then:

    For <input type="hidden" /> you can copy its value to some other elements to show what it contains. You can do this using javascript or jQuery.

    For the <div> element. Either add some content to it like: 

    <div class="ui-icon">
    Your content
</div>

    or specify its size (i.e. height and width) also display it as block with some border.

    <div class="ui-icon" style="hieght:10px; 
       width:100px; display: block; border: 1px solid red"> 
</div>