Jump to content
Sign in to follow this  
JcMagpie

Bootstrap layout still an issue on Tablets

Recommended Posts

Bootstrap has had layout issues on Tablets for some time now and looks to be still a problem in BS4, Site works fine on pc and phone but use an ipad or other tablet and you can run into problems. This is in both landscape and portrait mode, It's worst on 8" -10" tablets from what I have found.

With CE BS3 a simple hack was used to minimise this issue by adding some css.

/* fix tablet mode */

@media (min-width: 768px) {
    /* For mobile phones: */
    [class*="col-"] {
        width: 100% !important;
    }
} 
/* fix tablet mode end */

This however is not working with BS4! In order to get CE BS4 to display a bit more responsivly on the same tablet mode it's taken another dirty hack by adding some aditional css. It's taken several media brakes to make it behave but this is not a good solution? Has anyone else found a better way to make BS4 work on tablets?

/* fix tablet mode */
/* 768px */
@media (width: 1024px) {  

#tabletsizefix {
    width:45rem;
} 
}
@media (width: 768px) {  

#tabletsizefix {
    width:45rem;
} 
}
@media (width: 800px) {  

#tabletsizefix {
    width:45rem;
} 
}
/* fix tablet mode end */

image.png.32bd09ddee90b7721fe629f1886d29ec.png

image.thumb.png.8a8a4e137a36099a54900fb20d641f81.png

 


 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×