Jump to content

Is there any way to make a background color stretch out to full width of browser?

Recommended Posts

@Chris S - The problem is that you are using a background image, and it doesn't scale above 100% on Squarespace. Regular images will, which is how you get those full bleed galleries like Momentum, but background images are treated differently.

I have never found a good solution to scale a background image. I've tried numerous CSS hacks and jQuery scripts and none worked, but I didn't really spend a lot of time on it, so it's most likely possible to get a background image scaling the same way regular images do on Squarespace, but I don't know how.

Link to comment
  • Replies 32
  • Views 139.2k
  • Created
  • Last Reply

@kale Ok i see that issue that I am having now and it doesn't look like i can fix it easily. I tried the a few hacks and a JQuery script but both did not look right.

Is it possible to show me what I need to do to have just a regular image? This way I could maybe cheat and insert the text into the image using photoshop.

Link to comment
  • 9 months later...
  • 5 months later...

@cirmiz

I'd love to know if you found a solution for wrapping a normal block in an html div wrapper. I've successfully implemented the bioWrapper and css, but I'd love for that color block to wrap an entire chunk of content.

It appears that the code block automatically closes open divs? Is that the case?

Here's a link to the page on my site that i've been experimenting on.

http://mason-hedgecoth.squarespace.com/recent-work-1/

this is what i was hoping to execute:

alt text

Thanks for any and all help!

Link to comment
  • 2 weeks later...
  • 2 months later...
  • 1 year later...

Hi all, I love the look of the full width color blocks used in http://blussh.com.au/about by @Heids, is there a way to do this without being on Developer Mode?

The area I really want to target is the Content Header, or it might be the #page-body-header.

I am pretty beginner when it comes to code, is there an easy way to do this in the FIVE template? @cirmiz @kale

Any help is appreciated :)

Freelance graphic design, with a pretty basic understanding of code, but a craving for things to look pretty and work perfectly. This gets me in trouble! Visit my website to get in contact: www.januarymade.co.nz :)

Link to comment
  • 2 years later...

Hi @Heids, Here's a video tutorial for you on how to edit the background color stretch out to full width on a browser. Hope this helps!

Watch tutorial with the link below

https://www.askquesty.com/squarespace-answers/background-color-stretch-out-to-full-width-of-browser-squarespace-tutorialalt text

Have Squarespace questions/task and need help today? **You can hire us here.** Our answers are on-demand, video recorded, and only cost between $5 to $25. Estimates are free, 100% satisfaction guarantee, and trusted by hundreds of small businesses.

Link to comment

Archived

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


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.