Mobile header

  • tmadms

    (@tmadms)


    6 years, 8 months ago

    Hi,

    How can I change the header padding on my mobile site? I like how it looks on desktop but on mobile there is too much space between the header and the content.

    Is it also possible to change the page width for just mobile view? I feel like the revolution slider looks good on desktop, but would benefit from fitting to width for mobile. Any ideas on how I can achieve this? I seem to be able to do one but not both without additional css.

    Thanks

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • ikaring

    (@ikaring)

    6 years, 8 months ago

    Hi.
    Try put this in additional css.

    @media only screen and (max-width: 767px) {
	#main {
		margin-top: 40px;
	}
	.home .container {
		padding-left: 0;
		padding-right: 0;
	}
}
    Thread Starter tmadms

    (@tmadms)

    6 years, 8 months ago

    That worked, thanks!!

    Also, would you be able to help me change the color of the drop down menu in mobile view?

    It’s currently dark grey with white writing.

    What I’d like would be black writing, with a 20% opacity white for the background.

    Thanks

    ikaring

    (@ikaring)

    6 years, 7 months ago

    Sure, here it is:

    @media only screen and (max-width: 767px) {
	.flexnav li a,
	.flexnav li a.is-active,
	.flexnav li a:hover {
		background-color: rgba(255,255,255,.2);
		color: #000;
	}
}

    However it is recommended to learn how to use DevTools of browser for further customization.
    Cheers.

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

The topic ‘Mobile header’ is closed to new replies.