Jump to content

Responsive Design

By Ballina_Group, in Customize with code

Go to solution Solved by tuanphan,

Recommended Posts

Ballina_Group Level 2

Ballina_Group

Posted
Posted

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
  • Replies 2
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Popular Posts

tuanphan
tuanphan

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)

Posted Images

  • Solution
tuanphan Level 17

tuanphan

Posted
  • Solution
Posted

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%;
}
}

image.thumb.png.66095c49862d0531fc3e6698d74c7a85.png

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

Sign Up / Login
Go to topic listing

News

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Upcoming Webinars →

Hire a Designer

Stand out online with the help of an experienced designer or developer.

Get Matched →

Support

Community

Developers

Resources