Jump to content

Archived

This topic is now archived and is closed to further replies.

casseysdesigns

Resolution Conditional Hiding of Elements?...

Recommended Posts

casseysdesigns+    2
casseysdesigns

I am using both the most recent version of wordpress and dms2.

The website where I am trying to apply the customization : http://traciwarren.com/

 

I have created an icon menu and placed it on the right of the screen, it is indexed to show on the top layer. However, I dont like the way it works on smaller devices no matter which way I style it. It is also troublesome when it comes to user friendliness on smaller screens because it interfers with menus and content. 

 

What I want to do :

Hide it on screens smaller than 1200px;

 

I did try @media only screen and (max-width:1200px) { #textbox { display:none; } } and multiple varations.

 

Any help would be appreciated. I am open to options that require more than css, I am just not sure where to start.

 

Thanks,

Cassey

Share this post


Link to post
Share on other sites
batman    389
batman

Hi casseysdesigns

Cassey, I´m not sure but you can try with

 

#textboxufzezj9 {
position: fixed;
top: 0px;
right: 0px;
    min-width: 350px;
    display: none;
}

Life is too short to remove USB safely ...

Share this post


Link to post
Share on other sites
jmad+    80
jmad

You might try something like this and apply custom class to the text box.

 

.custom-class {
  @media (max-width: 768px){
 display: none;
  }
}

Share this post


Link to post
Share on other sites
ellenmva    112
ellenmva

casseysdesigns There are some utility classes included in DMS including hidden-phone and hidden-tablet. You'll find them under Visibility here, http://docs.pagelines.com/tutorials/html-css-utilities. Just add one of the classes under Standard Options of the section, Custom Styling Classes.

 

DMS_1_2___Just_another_WordPress_site.pn

 

Ellen

  • Like 1

Ellen Moore

Pagelines Developer

www.elsue.com www.betterdms.com

Share this post


Link to post
Share on other sites
casseysdesigns+    2
casseysdesigns
I did try the utility classes, however these do not work with all sections at this time. Thank you for the resource ;)

I was able to obtain the effect desired using the below code. Thank you all for your help working through this.

@media all and (max-width:1300px) {

#textboxid {

display:none;

}
}

Share this post


Link to post
Share on other sites
Danny    1,327
Danny

You can use the options that come with the DMS Pro Tools plugin, when enabled, all sections have the following options:

 

https://cloudup.com/cxPGmjs9RWR


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

  • Similar Content

    • Queue-it
      By Queue-it+
      Hi,
      Do you know how to hide a container background image only mobile?
      I've tried all the possible versions with .@media display hide [pl_uploads_url]/2016/10/image.png    but it would hide all container not just the image. 
       
    • Claude203
      By Claude203
      I have been searching for a solution on this but I'm not sure if it is possible but I'll ask anyway. I would like to format the margins of the post excerpts in the .article-wrap and in the .clip-box but this will vary depending on whether or not there is a featured image attached to the post. Is there a way to produce conditional results through CSS? 
       
      Thank you!
    • Claude203
      By Claude203
      Can the WHP Slider section be limited to appear on the Home Page only? If so, how? In other words, it is possible to hide it on specific posts/pages but what about ALL posts/pages except the Home Page? This was possible in the old WHP through a checkbox selection.
       
      Thank you!
    • JawDesigns
      By JawDesigns
      Hi to all,
       
      Is the only way to remove the search box in the mobile menu is to use CSS (see attached image)? Something like 'display: none' for example? Please see the image attached to see the search box. I have disabled the option for the NavBar but I expected this would also remove it from the mobile menu as well...
       
      My site is: www.jawdesigns.co.uk
       
      Kind regards,
       
      James
    • ketri
      By ketri
      Hi!

      It's a distraction when editing the site when the fixed area always reappears if I delete it and reload.

      How can I completely remove the fixed are or header or footer (with functions.php?) without just hiding them in CSS. As I don't want them to load unnecererily.

      Thank you!
×