Title: Error with some screen sizes and css code
Last modified: April 27, 2022

---

# Error with some screen sizes and css code

 *  Resolved [dardel](https://wordpress.org/support/users/dardel/)
 * (@dardel)
 * [4 years, 1 month ago](https://wordpress.org/support/topic/error-with-some-screen-sizes-and-css-code/)
 * [https://i.gyazo.com/c629b575eafa9876d44ddf2e47f24cae.png](https://i.gyazo.com/c629b575eafa9876d44ddf2e47f24cae.png)
   PHONE
    [https://i.gyazo.com/6eba93f0a8510b5ef8f0c6ab119eeee5.png](https://i.gyazo.com/6eba93f0a8510b5ef8f0c6ab119eeee5.png)
   IPAD
 * So the problem in the pictures is that when the screen is between 600px and 781px
   big, the pictures and the text flip out.
 * My solution for this is to make some css code that does so it looks the same 
   on phone until 781 px big. So I put an ID on the column, there are 3 columns,
   2 empty ones because I had a hard time getting the middle part where I wanted
   it to be.
    The empty ones have ID “hide1” and the css code for them are:
 * [@media](https://wordpress.org/support/users/media/) screen and (max-width: 781px){
   #
   hide1 { display: none; } } I put this in because I first thought this was the
   problem, but it didn’t help much.
 * Now Im trying to get css code that will actually help me, I found the stuff in
   the google chrome inspect element, but have no clue how to make css code for 
   it.
    I IDd the column that I want to make the css code in with ID: stackmobile
   and from the inspection tool I found this code:
 * [@media](https://wordpress.org/support/users/media/) (max-width: 599px)
    style.
   min.c…ver=5.9.3:1 .wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-
   column { flex-basis: 100%!important; }
 * This is what I want to put in css format, and upp the max-width to 781px but 
   I dont know how to, unless there is a smarter way, or someone has a better idea.
   
   The flex-basis does not seem to matter too much either.
 * Big thanks for reading this!
    -  This topic was modified 4 years, 1 month ago by [Jan Dembowski](https://wordpress.org/support/users/jdembowski/).
      Reason: Moved to Fixing WordPress, this is not an Developing with WordPress
      topic
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Ferror-with-some-screen-sizes-and-css-code%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 2 replies - 1 through 2 (of 2 total)

 *  [Umesh Gupta](https://wordpress.org/support/users/umesh84/)
 * (@umesh84)
 * [4 years, 1 month ago](https://wordpress.org/support/topic/error-with-some-screen-sizes-and-css-code/#post-15595487)
 * Hi [@dardel](https://wordpress.org/support/users/dardel/)
 * Please add the following CSS in that your CSS file.
 *     ```
       @media (min-width: 600px) and (max-width: 781px){
           #tjanster .wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column:not(:only-child) {
               flex-basis: calc(100% - var(--wp--style--block-gap, 2em)/2)!important;
           }
       }
       ```
   
 *  Thread Starter [dardel](https://wordpress.org/support/users/dardel/)
 * (@dardel)
 * [4 years, 1 month ago](https://wordpress.org/support/topic/error-with-some-screen-sizes-and-css-code/#post-15595542)
 * Big thanks sir!

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Error with some screen sizes and css code’ is closed to new replies.

## Tags

 * [screen size](https://wordpress.org/support/topic-tag/screen-size/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 2 replies
 * 2 participants
 * Last reply from: [dardel](https://wordpress.org/support/users/dardel/)
 * Last activity: [4 years, 1 month ago](https://wordpress.org/support/topic/error-with-some-screen-sizes-and-css-code/#post-15595542)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics