Horizontal Align Text Block in Mobile View.

Site URL: https://guava-guppy-sx4w.squarespace.com/

Hi  - 

trying to align these text buttons in mobile view.

I've followed the comments on similar posts but to no avail. 

Apologies for such a noob question. 

thanks in advance. 

PW: test1

Please send the site url

https://guava-guppy-sx4w.squarespace.com

PW: test

30 minutes ago, Murso500 said:

https://guava-guppy-sx4w.squarespace.com

PW: test

i mean the page with these elements

I see, sorry. 

It's basically any of the 'project pages' when viewed in mobile. 

Link to all the pages with the same issue: 

https://guava-guppy-sx4w.squarespace.com/moleskine-milan

https://guava-guppy-sx4w.squarespace.com/footpatrol-london

https://guava-guppy-sx4w.squarespace.com/carhartt-soho

https://guava-guppy-sx4w.squarespace.com/carhartt-shoreditch

https://guava-guppy-sx4w.squarespace.com/red-red-london 

https://guava-guppy-sx4w.squarespace.com/carhartt-showroom

https://guava-guppy-sx4w.squarespace.com/footpatrol-paris

https://guava-guppy-sx4w.squarespace.com/jd-sports-flagship

I'm not sure why your blog page has different navigation blog post, so here a work around with the help of some custom code

1. Settings->Design->Custom Css

@media only screen and (max-width: 768px) {
    .col.blog-navigation {
        width: 50% !important;
        float: left !important;
    }
}

2. Settings->Advanced->Code Injection

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
	jQuery(document).ready(function() {
    	$("a:contains('← Previous')").closest(".col").addClass("blog-navigation");
		$("a:contains('Next →')").closest(".col").addClass("blog-navigation");
    });
</script>

3. Outcome

Amazing thanks so much. Worked a charm. 

For reference it's not a blog page. The blog page had some formatting elements that didn't work for me so these are just text hyperlinks to give a similar impression. 

You are a legend. Much appreciated.