Jump to content

Responsive Design

Go to solution Solved by tuanphan,

Recommended Posts

Site URL: http://www.ballinagroup.com/our-work

We recently noticed that our site on a tablet screen size doesn't resize the text boxes so they float under each other. The responsive design works fine for phone screens but I can't get it to work for tablet screens. I've tried a few different CSS codes to make this work and nothing has so far.

Attached are 3 screen shots of desktop mode, tablet mode, and phone mode when I'm in editing so you can see what it looks like. If anyone can help that would be great.Desktop.thumb.jpg.3042e6bb5ab81f63c83dfcbe83b429a8.jpgTablet.thumb.jpg.01e2a3a673b479a684a5b89cc7c7f1e5.jpgPhone.thumb.jpg.80dc0d8f046f3fead31876bfc263f78d.jpg

Link to comment
  • Solution

Add to Home > Design > Custom CSS

/* text responsive on tablet */
@media screen and (min-width:768px) and (max-width:991px) {
div#page-5b9a941cb8a045cb6ca5f6e6 .span-12>.row:nth-child(3) .span-2 {
    width: 33.33%;
div#page-5b9a941cb8a045cb6ca5f6e6 .span-12>.row:nth-child(3) .span-10 {
    width: 66.67%;
div#page-5b9a941cb8a045cb6ca5f6e6 .span-12>.row:nth-child(3) .span-10 .span-2 {
    width: 50%;


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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.