Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

How to make header responsive

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

This topic is: resolved

Tagged: responsive header

This topic has 2 replies, 2 voices, and was last updated 8 years, 11 months ago by kmoody17.

Viewing 3 posts - 1 through 3 (of 3 total)

Author

Posts
August 21, 2017 at 4:37 pm #210598

kmoody17
Member

Hello,

I am trying to make my header responsive. I am using the simple theme and changed the header with this css code, however, the header doesn't resize when viewing on a phone. any help would be greatly appreciated.
.header-image .title-area {
margin: 0 auto;
max-width: 800px;
padding: 0;
}

.header-full-width .title-area {
float: none;
width: 100%;
http://friendsanimalsnassau.org

August 22, 2017 at 2:33 am #210609

Victor Font
Moderator

You have custom CSS that is breaking the responsivness. You have background-size: cover !important;. It should be background-size: contain !important;. You'll find this in the additional CSS you've added.

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

August 22, 2017 at 7:25 am #210619

kmoody17
Member

Thank you a million times over!!! I have been racking my brain trying to figure that out. Have a wonderfull day.
Author

Posts

Viewing 3 posts - 1 through 3 (of 3 total)

The forum ‘Design Tips and Tricks’ is closed to new topics and replies.