Responsive problem (desktop tablet)

Greetings….screen size is part of the equation, but the other part is resolution as well. What is your laptop resolution set to?

Responsiveness, resolution, and screen size can be quite challenging, especially when you will have a wide variety of screens and resolutions that website visitors will have.

For Morphology, the media query to change from mobile to normal view, such as a desktop monitor, is set as:

/* Medium devices (tablets, 768px and up) */
@media (min-width: 48em) {}

Basically anything above that will be a normal view. But one of the other challenges is the theme design itself. Because this theme has a side column for navigation, it requires a certain amount of width to be usable, but it also requires that the main content area does not get too small either. It’s a kind of balancing act to try and find what works for the most people, although it may not for some.

The only two options I can suggest for you and the fact you are on a very small screen and resolution, is to change the resolution on your laptop to be larger if you can. The second option (if the first is not possible) is to change the media queries. It will probably take some trial and error attempts, but remember that what works for you, may not work for the typical website visitor.

To do this, you will need to create a custom CSS file in one of three ways…

1. If you are using a child theme to modify other theme files, use the style.css for it
2. If you use Jetpack, you can use the built-in Custom CSS feature
3. Or, a plugin called Simple Custom CSS

Let me know if you want to opt in for option 2 and I will paste a large back of code you will need to copy and paste into your custom stylesheet so that you can modify the media queries.