I believe you mean display:none;

On Monday, August 3, 2015, John D <xfs...@hotmail.com> wrote:

> I guess it all depends on in which contents you are trying to use but a
> simple code such as:
>
> .mystyle {
>    display: hidden;
> }
>
> Will hide the block which has a class called "mystyle" .  when you want to
> unhide it, you just need to comment it out like this:
>
> .mystyle {
>   /* display: hidden; */
> }
>
>
>
>
> -----Original Message----- From: Rick Lecoat
> Sent: Monday, August 03, 2015 9:14 AM
> To: CSS-D list
> Subject: [css-d] Rules for making content hidden and visually hidden
>
> For the last few years I've been using a bunch of content visibility
> rules, which I think I originally extracted from Andy Clarke's 320-and-up
> framework. I'm wondering if the methods that they use are still considered
> best practice for achieving the desired goals, and whether anyone has
> better rulesets that I could update them with (I've googled, but the
> results have not been conclusive). A particular reason for addressing this
> now is that two of the classes use !important declarations. I'm
> increasingly moving to a modular, SASS-based CSS structure and I'm not
> comfortable having !important so early on in the specificity cascade.
>
> Here are the rules I'm using (I'm showing them as classes for simplicity,
> but in fact they are SASS mixins and get applied in a variety of ways):
>
> /* hide from visual and speaking browsers */
> .hidden {
>    display : none !important;
>    visibility : hidden;
>    }
>
> /* hidden but available to speaking browsers */
> .visuallyhidden {
>    overflow : hidden;
>    position : absolute;
>    clip : rect(0 0 0 0);
>    height : 1px;
>    width : 1px !important;
>    margin : -1px;
>    padding : 0;
>    border : 0;
>    }
>
> As you can see each contains an !important declaration, which means that I
> need to include a similar declaration in my css whenever I want to 'turn
> off' either of the above rules. My two 'reversal' rules are currently as
> follows:
>
> .unhidden {
>    display : block !important;
>    visibility : visible;
>    }
>
> .visuallyhiddenoff {
>    overflow : visible;
>    position : static;
>    clip : none;
>    height : auto;
>    width : auto !important;
>    margin : 0;
>    padding : 0;
>    border : 0;
>    }
>
> Negating the .visuallyhidden rule, in particular, feels cumbersome -- too
> many rules to 'undo' and I worry that it has too many opportunities to end
> up with an unintended result. With this in mind, I'd like to know if anyone
> has:
>
> a) an improvement on the .hidden rule, ideally getting rid of the
> !important declaration but remaining robust;
> b) a less verbose/complex rule for making something visuallyhidden;
> or
> c) confirmation that these are the best rules and that I should leave them
> alone.
>
>
> ______________________________________________________________________
> css-discuss [css-d@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>


-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to