Jump to content

Place Logo Image in Bottom Right Corner of Hero Image

Recommended Posts

  • Replies 6
  • Views 1.3k
  • Created
  • Last Reply

Top Posters In This Topic

3 hours ago, tinymachine said:

Site URL: http://www.theblackgryphon.com

Howdy–

 

So, I'm trying to position a logo to the bottom right of the hero/header image. I've been trying to mess around with absolute positioning but I keep hitting a wall. Maybe I'm just not looking at it from the right perspective? Any help is super appreciated.

Place like so? What is the logo image you want to place

image.thumb.png.8d866ead231357916220f397b982927f.png

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date picker form field)
💫 Gallery block 7.1 workaround
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment
20 hours ago, tinymachine said:

 

Placed like so, yes. For the sake of explanation, let's just say the white "Black Gryphon" text logo.

Add to Design > Custom CSS

div#block-yui_3_17_2_1_1616612699324_2538 {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 999;
    width: 200px;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
5 hours ago, tuanphan said:
div#block-yui_3_17_2_1_1616612699324_2538 {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 999;
    width: 200px;
}

Worked like a charm. One thing that was tripping me up is that it wasn't showing that it was pinned to the corner in the Squarespace editor, but on the live site it looked fine. I posted a picture for posterity in case someone else runs in to the issue.

Thanks so much for the help.

 

IMAGES:

(1) How it looks in the editor

(2) How it actually looks on the live site

Screen Shot 2021-07-27 at 11.36.51 AM.png

Screen Shot 2021-07-27 at 11.38.40 AM.png

Link to comment
On 7/27/2021 at 10:39 PM, tinymachine said:

Worked like a charm. One thing that was tripping me up is that it wasn't showing that it was pinned to the corner in the Squarespace editor, but on the live site it looked fine. I posted a picture for posterity in case someone else runs in to the issue.

Thanks so much for the help.

 

IMAGES:

(1) How it looks in the editor

(2) How it actually looks on the live site

Screen Shot 2021-07-27 at 11.36.51 AM.png

Screen Shot 2021-07-27 at 11.38.40 AM.png

Not sure why it doesn't work in editor. If you can add me as an admin, I can check in editor ☠️

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Found other problems. Do you need to fix?

Site URL – https://www.theblackgryphon.com/

1. (Desktop/Tablet – Event) Pagination is too close to the edge of the screen.

https://www.theblackgryphon.com/weekly-events/thirsty-thursdays

theblackgryphon.com-01-min.png

2. (Mobile – Homepage) On desktop, the entire image can be seen. On mobile, image is partially cut off.

https://www.theblackgryphon.com/

theblackgryphon.com-02-min.png

3. (Mobile – Homepage) Page is long. Add button Back to top?

https://www.theblackgryphon.com/

theblackgryphon.com-03-min.png

4. (Mobile – Menu) Reduce space between Contact and Gift cards?

https://www.theblackgryphon.com/

theblackgryphon.com-04-min.png

5. (Tablet – Header) Menu is cut into 3 lines.

https://www.theblackgryphon.com/

theblackgryphon.com-05-min.png

6. (Tablet – Footer) Email is cut into 2 lines.

https://www.theblackgryphon.com/

theblackgryphon.com-06-min.png

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

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

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.