Change Tablet width setting @media

Hi there,

Can you please tell me which setting I need to change so that a tablet has 100% width - at the moment, only in portrait view on a tablet is it 100%, in landscape it reverts to 85% width - I need it to be 100%.

Can you tell me what minimum width or maximum width I need to change please?

Thank you,
Leo

Code:

.box_as_background {
width: 85%;
margin: 0 auto;
border: 2px solid black;
}
 
.box_as_background {
background: white;
}
body {
background-image: url("http://a1status.com/stripes.png");
}
 
@media only screen and (max-width: 960px) and (min-width: 768px){
.container_24,.grid_24 {
width:100% !important;
}
}
.container_24,.grid_24 {
width:100% !important;
}
 
@media only screen and (max-width: 480px){
.header_wrapper .logo_wrapper .logo img ,.container_24,.grid_24{
width:95% !important;
}
 
@media only screen and (max-width: 767px){
.box_as_background {
width: 100% !important;
}
}

 

Hi Leo!

Could you please provide us some edited screenshot of your website for different view in tablet?

Thanks,
Praveen

 

Hi Praveen, please see the attached images - it's a 7" tablet but I have tried it on 10" and the same thing. Vertical is fine, Horizontal has the issue. Thank you, Leo

 

Hello Leo!

Try the css code given below.

Code:

@media only screen and (max-width: 1260px) and (min-width: 960px){
.box_as_background {
  width: 100%;
}
}

Thanks,
Praveen

 

Hi Praveen,

No - that made no difference? It's still the same on the tablet.

Thanks,
Leo

 

Hello Leo!

Try the css code given below.

Code:

@media only screen and (max-width: 1260px) and (min-width: 768px){
.box_as_background {
  width: 100% !important;
}
}

Thanks,
Praveen