kdeemer

@tuanphan 

On my. homepage, there are two sections with Text boxes and an Image. I have them laid out to have the Images beside the text. This looks fine in a desktop browser. On mobile in portrait mode, the text is displayed above the image, which is also fine. But, in mobile landscape mode, I would like the images to be beside the text like on the desktop. Can someone please help. I've tried several approaches unsuccessfully.

The homepage URL is https://brass-endive-883l.squarespace.com/

Thanks.

This added to the page header code injection solved the problem. 
 

<style>
  p {
        box-sizing: border-box;
        padding-left: 20px;
    }

<style>

Got answer from ChatGPT. 

Thanks. Unfortunately, that didn’t change anything. 

On your screenshots, the text is much smaller in Portrait mode. Does it return to a larger size when you refresh the page? Here are screenshots from my iPad; one in landscape with normal text, one after rotating to portrait with much smaller text, and then after refresh, a return to normal size. 

It's on several pages. Here is one

https://brass-endive-883l.squarespace.com/xxxiii-2023-gila-wilderness

Thanks for taking a look

I have sections with text blocks in Paragraph 1 format. It looks fine on my iPad in landscape orientation. But when I rotate to portrait, the text shrinks dramatically. If I refresh the page, it is fine. Anything I can do to prevent this.  Thx. 

Here is another screenshot showing that the padding has caused the text to extend beyond the text box 

I have added the following custom CSS referencing a text block (The one with Mt Rainier):

#block-yui_3_17_2_1_1693697627206_59180
{
  padding-left: 20px;    
}

It adjusts the left spacing of the text as desired. But, it removes the right hand margin (on mobile). I tried adding "padding-right" but it doesn't seem to do anything.

The page is https://brass-endive-883l.squarespace.com/our-adventures.  Screenshot below. Thanks for taking a look.

Thanks for the reply. I only plan to use the indent on one page so either restricting it to that page or to the whole site would work. This is the page

https://brass-endive-883l.squarespace.com/our-adventures

I would like less space between the images and text - especially on mobile. The sizes of the blocks on the grid don't allow me to position the text block exactly where I want it, so I placed it right up against the image and then used the Indent to add some more space.

I would like to adjust them amount of space inserted when selecting the Indent icon in a text block. Is there a method of doing this?

How would I go about reducing the space inserted when a paragraph is indented in a text box?

I have a page section with a text box and text in standard p1 format. This looks fine on all device sizes. If I view the page on my tablet in Portrait orientation, it is fine. If I rotate it to Landscape it is fine. But, if I then rotate it back to Portrait, the font shrinks dramatically. If I refresh the page it jumps back to the original size. I don't have any custom CSS or anything that should be affecting the font. Examples are attached. The first image shows the page loaded in Portrait mode. The second is after rotating to landscape, and the third is after rotating back to Portrait. Any advise appreciated.

Thanks

I'm also looking for a solution to this. Has anyone succeeded in making an entire text block clickable?

How can I add a section with images and titles, such that the images and their titles are linked to other pages and clickable? The Carousel is perfect, but I want the images to be in fixed positions and not scrollable. It's easy to make the images clickable, but not the titles (or captions) unless the have an underlined hyperlink or are a button. The final section on the homepage has the look I want, but I want fixed images and not a carousel.

Thanks