Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • April 26, 2014 at 9:29 pm #256683
    sky19er

    I’ve seen many posts about this — so forgive me if this has already been answered many times — but I can’t seem to find my exact issue/solution. My menu/nav is overlapping my logo on a couple of sites in ipad landscape and narrower browser widths (1024px, for example). Both sites have unusually wide logos, and one is just HUGE, so that may be the issue. I’m using the “custom pixel value” header size. It may be happening on other sites, too, but the two I’m sure of are http://nation-foundation.org/ and http://departmentoffungraphs.com . What do you suggest?

    Here’s a screen grab of one, showing the issue:
    https://www.evernote.com/shard/s320/sh/23e495d0-7fb1-4d1b-b9a6-16722a9d9417/4fdcab5d3f2456523eaa097b5148a0f8

    April 28, 2014 at 6:44 pm #257230
    Yigit

    Hey sky19er!

    Please add following code to Quick CSS for “wide logo” website

    @media only screen and (max-width: 1140px) {
.av-main-nav > li > a {
padding: 0 6px; }}

    and this one to the huge one

    @media only screen and (max-width: 1340px) {
.av-main-nav > li > a {
padding: 0 5px; }}
@media only screen and (max-width: 1140px) and (min-width: 990px) {
.logo img {
width: 75%; }}

    Best regards,
    Yigit

    April 29, 2014 at 3:25 am #257440
    sky19er

    Thanks, Yigit! I was still getting some overlap — and I’d rather size down the logo than lose the padding between nav items — but this got me on the right track.

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘menu overlaps logo in ipad landscape, and 1024 browser widths’ is closed to new replies.