Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Hiding an image displayed on mobile version 7.1


JarynD

Question

Site URL: https://www.deviantdigitalservices.com/

I'm trying to hide an image block on mobile but so far the CSS code I've inserted is not working. See below for the code I'm using under Design > Custom CSS

I've watched YouTube videos and found previous threads in the forum with this code suggestion which make sense and other users vouch for. The problem, I think, is I have 7.1 version of Squarespace. Even when I ask support they're not sure why the code isn't applying properly and they directed me here.

I tried simply resizing the image instead, which looks good on the mobile emulator within Squarespace. But when I actually go to the site to test on an android or apple device, the image is not displaying properly so it looks like removing is my only choice. Has anyone had any luck with their CSS code for the newest version of Squarespace? The following is not cutting it for me:

 

/* CSS FOR TABLET AND MOBILE */
@mobile: ~"only screen and (max-width: 640px)";
@tablet: ~"only screen and (min-width: 641px) and (max-width: 949px)";

/* CSS FOR TABLET */
@media @tablet {
/* Insert Code for Tablet Below This Line*/

/* Insert Code for Tablet Above This Line */
}

/* CSS FOR MOBILE */
@media only screen and (max-width: 640px) {
 #block-b3f224c6c3725d7d5022 {
   display: none;
 }
}
/* Insert Code for Mobile Above This Line */

 

Link to comment

6 answers to this question

Recommended Posts

  • 0
On 9/30/2020 at 10:56 PM, JarynD said:

Well that could be part of the problem lol. I'm trying to hide the image near the top of the home page which says "Digital Marketing"

Add to Home > Design > Custom CSS

/* hide digital on mobile */
@media screen and (max-width:767px) {
[data-section-id="5ecc2ed3063db750f2a4c909"] {
	display: none;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
21 hours ago, Eggers said:

@tuanphan is there also a solution to hide it on tablets too? So scho a element only on desktop? Not on Tablet or mobile? 

I want to hide some buttons, i could hide them on mobile, but they still shown on the tablet. 

Thanks in advance 

Tablet + Mobile use this query

@media screen and (max-width:991px) {enter CSS to hide buttons here}

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...