Harry
Harry

Reputation: 489

Spacing Problem

I have a div with margin and padding in it. And I want to hide the content inside the div. I am using js to show, hide process. The problem is when I tried to hide the content, it gets hide but the spacing or the gap remains the same. Firefox renders properly, but not in ie. How can I solve this issue in ie using css?

Upvotes: 1

Views: 165

Answers (4)

David Thomas
David Thomas

Reputation: 253308

I may be reading your question wrong, but I'm assuming that, since the "spacing and gap remain (sic) the same," you're using

#style {visibility: hidden; }

If you use

#style {display: none; }

and whatever has the id of style will be removed from the document entirely, rather than simply hidden from sight.

Upvotes: 0

Mathew
Mathew

Reputation: 8279

Try removing the content and setting the container's padding to 0.

Alternatively, to keep things a little tidier; remove the margin from the container div, add a wrapper div with the same margin value but as a padding attribute, and simply show / hide the container div.

CSS

#wrapper, #container{
    padding:1em;
}

HTML

<div id="wrapper">
    <div id="container">This is the content that will be hidden</div>
</div>

Upvotes: 0

User
User

Reputation: 30945

If you remove the content from a div, it may be hidden completely with margins and paddings in some brwosers but stay visible with both margins and padding in the others.

You can try just applying the display style to the div:

<div style="display:none;">
    text...
</div>

and it will be away completely.

Upvotes: 2

Andre Miller
Andre Miller

Reputation: 15493

You can use nested divs, place the padding and margins you do not want to hide in the parent div and the padding and margin you do want to hide in the child div and only hide the child div with your javascript.

Upvotes: 0

Related Questions