How to modify template according to the tablet size in portrait and landscape modes?

QuestionsCategory: CustomizationHow to modify template according to the tablet size in portrait and landscape modes?
Ivan Cai asked 11 months ago

Good afternoon.
I am using your template https://www.baamboostudio.com/project/anthem-weebly-theme/

Purchased in April 2016.
My website is http://www.chuankok.com
When the webpage is viewed on a tablet in portrait mode as per below, the images are moved responsively to a mobile look.
http://www.chuankok.com.sg/docs/Tablet%20in%20Portrait.png
http://www.chuankok.com.sg/docs/Tablet%20in%20Landscape.png
As the tablet screen is still big enough to view webpages in a normal webpage look (as per tablet in landscape.png), is it possible to kindly modify the template to allow a normal look in tablet portrait mode?
This will make the site look much better in portrait mode.

4 Answers
Baamboo Studio Staff answered 11 months ago

Hi Ivan,

Please follow the steps:

  • Locate line 3667 in main_style.css file:

/***** Responsive Menu & Cart ****/
@media only screen and (max-width: 980px) {

Change 980px to 767px.

  • Then locate line 3161:

@media only screen and (max-width: 839px) {

Change 839px to 767px.

 

  • Save the changes.
Ivan Cai answered 11 months ago

Hi and thank you for the fast response.
 
I have done as per your advice. 
 
The nav menu display on vertical now looks like the display on horizontal.
 
However, the contents in vertical still looks verticals.

Ivan Cai answered 11 months ago

Hi,
Please kindly advise how I can make the contents in verticals on tablet view look like the the view on pcs.

Baamboo Studio Staff answered 10 months ago

Hi Ivan,

Please locate line 3161:

@media only screen and (max-width: 839px) {

Then change it to:

@media only screen and (max-width: 767px) {