Guest Posted May 10, 2020 Share Posted May 10, 2020 Site URL: https://potato-sphere-g3k8.squarespace.com/ Hi! I was wondering how to change the order of images on my first page on mobile. I attached the photo of what I would like on mobile: my image, then the text and button. Is there a way to hide the second image below? Wesbite: naonow.com Password: naonow On computer I'd like to hide this image I duplicated for mobile view: Thanks so much!! @tuanphan Link to comment
8B39C8 Posted May 10, 2020 Share Posted May 10, 2020 From what I understand you want your image to appear only once, both on mobile and desktop, right? On Desktop the image is supposed to be on the right side of your text, while on mobile, its supposed to be above the text, correct? This should be easily possible if you drag the image into the text so the insertion point doesn't appear as a line but rather as a greyish rectangle inside the text. Link to comment
Guest Posted May 11, 2020 Share Posted May 11, 2020 Yes, I would like the image only once on mobile and once on computer! Except it won't order properly on mobile mode unless I duplicate the picture-- therefore, how do I hide it on computer mode? and then hide the other on mobile? Thanks!! Link to comment
tuanphan Posted May 11, 2020 Share Posted May 11, 2020 Add to Home > Design > Custom CSS /* hide image on desktop */ @media screen and (min-width:768px) { [data-section-id="5eb8354530a3d76767ae2553"] { display: none; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
Guest Posted May 11, 2020 Share Posted May 11, 2020 Thank you! Amazing, that worked! Now how do I hide the second duplicate image in mobile mode only? @tuanphan I only want the first top one to show in mobile mode! Is there also a way to decrease the space size between the picture and the caption "active learning.." so that the spacing is the same as this other photo below? Spacing: Link to comment
tuanphan Posted May 12, 2020 Share Posted May 12, 2020 21 hours ago, rachelt said: Thank you! Amazing, that worked! Now how do I hide the second duplicate image in mobile mode only? @tuanphan I only want the first top one to show in mobile mode! Is there also a way to decrease the space size between the picture and the caption "active learning.." so that the spacing is the same as this other photo below? @media screen and (max-width:767px) { div#block-5308c219f381007ee373 { display: none; } [data-section-id="5eadeeafed72103d3af36c56"] .content-wrapper { padding-top: 0 !important; } div#block-71ea98765b68363ece36 { padding-top: 0 !important; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
LeeLee Posted May 19, 2020 Share Posted May 19, 2020 Would this work if I wanted to rearrange the image (of the guy at his desk) to place it inbetween dry needling and corporate massage on Mobile only? Desktop is correct and I have attached an image, Mobile loads as attached image https://www.melbmyo.com.au/ Thanks Link to comment
tuanphan Posted May 19, 2020 Share Posted May 19, 2020 2 hours ago, LeeLee said: Would this work if I wanted to rearrange the image (of the guy at his desk) to place it inbetween dry needling and corporate massage on Mobile only? Desktop is correct and I have attached an image, Mobile loads as attached image https://www.melbmyo.com.au/ Thanks The way you arranged the 2 images / text below makes the order of it incorrect (no code needed to solve this). Hold and drag the text (text 3 & text 4) up below image 3 & image 4, until you see a black horizontal line below the image (horizontal line width = image width) Done. Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message 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
Recommended Posts
Archived
This topic is now archived and is closed to further replies.