Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I hide a TD tag using inline JavaScript or CSS?

How can I hide a <td> tag using JavaScript or inline CSS?

like image 793
Blankman Avatar asked May 27 '09 15:05

Blankman


People also ask

How do I hide an element inline?

To hide an element, set the style display property to “none”. document. getElementById("element").

How do you hide a table in CSS?

Usually, to hide an element from view, you use the 'display' property and set it to 'none'. But CSS also has a property called 'visibility', which hides elements in a different way. In particular, we use 'visibility: collapse' here, which is designed especially for hiding table columns and rows.

How do I hide table tags?

The hidden attribute hides the <table> element. You can specify either 'hidden' (without value) or 'hidden="hidden"'. Both are valid. A hidden <table> element is not visible, but it maintains its position on the page.


2 Answers

.hide{

visibility: hidden

}

<td class="hide"/>

Edit- Just for you

The difference between display and visibility is this.

"display": has many properties or values, but the ones you're focused on are "none" and "block". "none" is like a hide value, and "block" is like show. If you use the "none" value you will totally hide what ever html tag you have applied this css style. If you use "block" you will see the html tag and it's content. very simple.

"visibility": has many values, but we want to know more about the "hidden" and "visible" values. "hidden" will work in the same way as the "block" value for display, but this will hide tag and it's content, but it will not hide the phisical space of that tag. For example, if you have a couple of text lines, then and image (picture) and then a table with three columns and two rows with icons and text. Now if you apply the visibility css with the hidden value to the image, the image will disappear but the space the image was using will remaing in it's place, in other words, you will end with a big space (hole) between the text and the table. Now if you use the "visible" value your target tag and it's elements will be visible again.

like image 63
TStamper Avatar answered Sep 21 '22 12:09

TStamper


What do you expect to happen in it's place? The table can't reflow to fill the space left - this seems like a recipe for buggy browser responses.

Think about hiding the contents of the td, not the td itself.

like image 36
edeverett Avatar answered Sep 17 '22 12:09

edeverett