Media screen isn't fix on every display

  • Unknown's avatar

    Hi,

    I have following CSS to take my menu bar below the header:

    h1.entry-title {
    	padding-top: 5px;
    }
    
    .entry-header+.entry-content {
    	margin-top: 5px;
    }
    
    @media screen and (min-width: 600px) {
    	.main-navigation {
    		position: relative;
    		z-index: 10;
    		top: 390px;
    	}
    
    	.header-image {
    		position: relative;
    		top: -30px;
    	}
    }
    
    .site-content article {
    	top: 40px;
    }

    But not on every display is the same allocation of the site content, menu bar and header. If I have a smaller display it works because I can modify the sizes for a smaller display. But when I go to my website with a bigger screen than is everything on another place for example the menu bar is in the header and the entry title is at the place of the menu bar.

    How can I fix the sizes or the places of my changed things that the website looks on all displays the same?

    Thank you,
    Laura

    The blog I need help with is: (visible only to logged in users)

  • The topic ‘Media screen isn't fix on every display’ is closed to new replies.