Solved

remove element from displaying on mobile devices

Posted on 2016-10-28
3
78 Views
Last Modified: 2016-11-03
I am trying to remove the "Since 1950" in the header (header right widget) on cell phones.  I am not sure what I did wrong.

@media only screen and (max-width: 320px) {
  .site-header h1 { display:none;}
}
  

Open in new window

0
Comment
Question by:nsitedesigns
3 Comments
 
LVL 35

Assisted Solution

by:Terry Woods
Terry Woods earned 250 total points
ID: 41864806
Works fine for me in Chrome; it disappears when I resize below 320px wide.

By the way, I'm assuming you're looking at the same site you linked to in a previous question, with a dev copy currently at http://36a.ed7.myftpupload.com/
0
 
LVL 22

Accepted Solution

by:
Kim Walker earned 250 total points
ID: 41864893
Many mobile devices mimic much larger screens unless the page contains a meta tag to override their natural behavior. Be sure to include the following meta tag in the head of your document.
<meta name="viewport" content="width=device-width, initial-scale=1.0">

Open in new window

Also be sure to view the page in the portrait orientation as many modern mobile devices have a width of 480 pixels in landscape orientation.
0
 

Author Comment

by:nsitedesigns
ID: 41867054
How do I add this to the header in wordpress?
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

This article discusses four methods for overlaying images in a container on a web page
Color can increase conversions, create feelings of warmth or even incite people to get behind a cause. If you want your website to really impact site visitors, then it is vital to consider the impact color has on them.
The purpose of this video is to demonstrate how to update a WordPress Site’s version. WordPress releases new versions of its software frequently and it is important to update frequently in order to keep your site secure, and to get new WordPress…
The purpose of this video is to demonstrate how to prevent comment spam on a WordPress Website. This will be demonstrated using a Windows 8 PC. Plugin Akismet will be used. Go to your WordPress login page. This will look like the following: myw…

785 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question