DavidBakes

15 hours ago, Ziggy said:

Hi @DavidBakes, have you tried setting the image block design to "card"? Depending on how you have that block styled, you can certainly use that to align the text and image better (though with the quantity of text it will still extend below when it gets too tall for the image). You can adjust when this block stacks the image and text with some CSS like this: https://schwartz-edmisten.com/blog/force-an-image-card-to-stack-on-tablet-in-squarespace

@media screen and (max-width: 800px) {
.sqs-block-image .design-layout-card:not(.sqs-narrow-width) {
    display: block!important;
}
.sqs-block-image .design-layout-card:not(.sqs-narrow-width) .image-card-wrapper {
    width: 100%;
    margin-left: 0!important;
}
.sqs-block-image .design-layout-card:not(.sqs-narrow-width)>div:first-child {
    width: 100%;
}
}

Hope that helps!

Hi Ziggy, thank you for your response and advice. This is something I've considered  but unfortunately the text formatting in the image card is not flexible enough to do what I would like to with the text next to it.

Update-- Ended up switching to using an image card after all. Thank you!

13 hours ago, Ziggy said:

Hi @DavidBakes, have you tried setting the image block design to "card"? Depending on how you have that block styled, you can certainly use that to align the text and image better (though with the quantity of text it will still extend below when it gets too tall for the image). You can adjust when this block stacks the image and text with some CSS like this: https://schwartz-edmisten.com/blog/force-an-image-card-to-stack-on-tablet-in-squarespace

@media screen and (max-width: 800px) {
.sqs-block-image .design-layout-card:not(.sqs-narrow-width) {
    display: block!important;
}
.sqs-block-image .design-layout-card:not(.sqs-narrow-width) .image-card-wrapper {
    width: 100%;
    margin-left: 0!important;
}
.sqs-block-image .design-layout-card:not(.sqs-narrow-width)>div:first-child {
    width: 100%;
}
}

Hope that helps!

Hi Ziggy, thank you for your response and advice. This is something I've considered  but unfortunately the text formatting in the image card is not flexible enough to do what I would like to with the text next to it.

Hello! On the homepage, I would like to vertically center this text block to the image block on PC:

But I would like the text to be underneath the image on tablet and mobile.

I tried reading through a couple forum posts to do it using CSS but wasn't able to get it to work, would someone be able to help?

Website: https://www.pxresources.com.au/

Thank you!

On 10/12/2022 at 11:58 PM, tuanphan said:

Add to Design > Custom CSS > then save & reload the site

.Mobile.loaded {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.Mobile-bar.Mobile-bar--top {
    background-color: transparent;
}

 

It worked, thank you very much for the assistance!

Hi @bangank36 - sorry about that, it is 123 now. 

Site URL: https://badger-flugelhorn-yp72.squarespace.com

Hello,

I've recently added a folder to my site navigation as such:

But I noticed that Index-type navigation can't be added inside the folder. I have been using the Index type navigation to control things such as banner, alternating background colors on different sections, etc. For example: 

I would like all of the pages including those within the folder to have a Banner at the top, and be able to alternate background colors in different sections like the Home page allows.

Is there a way to do this within a folder?

Site password is 123

Thank you!

Site URL: https://badger-flugelhorn-yp72.squarespace.com

Hello,

On the desktop version of my site, the site logo and navigation overlay on top of the banners at the top of each page:

However, the mobile version has it on a white background above the banner image:

Is there a way to get the logo and menu 3 lines to overlay on top of the banner image in the mobile version as well?

Password for the site is 123

Thank you!