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

Image next to text - full bleed 7.1


laurenjaynehughes

Question

15 answers to this question

Recommended Posts

  • 0

Step 1. Add Blank Section

Step 2. Add Background Image

Step 3. Add 2 Columns

left: Text Block

right: Spacer Block

Step 4. Use CSS Float to push image to right, & reduce image to 50%

Step 5. Use CSS to rever image size to 100% on mobile.

Can you  do steps 1,2,3 then share link? I can take a look

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
5 hours ago, laurenjaynehughes said:

Hey @tuanphan I added up to step 3 like you mentioned, it's located under the email sign up.

lettuce-beagle-ds22.squarespace.com and the password is Whitefern2020

Thanks!

 

5 hours ago, monicahardy said:

@tuanphan what is css float?

 

where email signup?

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
7 minutes ago, laurenjaynehughes said:

Sorry, it's the section on the page with this copy on the left

"WHITE FERN WEDDINGS: Our bespoke wedding styling ensures the most important day of your life looks exactly how you imagined it would, so you can relax and enjoy every moment of your perfect day."

Thanks!

Add to Home > Design > Custom CSS

@media screen and (min-width:768px) {
[data-section-id="5ebb4ca25111036cfc859fed"] .section-background {
    width: 50%;
    left: 50%;
}
}

 

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
3 minutes ago, laurenjaynehughes said:

Thanks! So if I wanted the color background to be behind the copy and an actual photo to be on the right, how would I do that? And right now when it goes to mobile it's just one section? Thank you so much!

Add image to section background.

& set  section background color

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
On 12/26/2020 at 1:18 AM, TessPham said:

Hi, I have tried the CSS above and it works well. But I cannot change the theme color, whatever I do it still keep the same white background.  And I also have the same issue with stacking on mobile version. Can you please help with this? 

Thanks a lot!

Screen Shot 2020-12-25 at 12.16.14 PM.png

Can you share site url? We can help easier

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
On 8/19/2021 at 12:45 AM, kethee said:

@tuanphan Thank you for this fix! I was wondering if you were able to look into the previous posters question about (1) stacking in mobile and (2) changing the background color of the text half.

I am running into the same issue where on mobile the text overlaps the background image, and when I change the background color it remains black in my case.

https://heron-snail-244c.squarespace.com/careers-1

Thank you!

Hi. The url doesn't exist. Can you check it again?

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...