Responsive Issues – Navigation & carousel on devices

[lis_locket]

Hi,

I’ve an issue with the navigation – as you’ll see from the screenshot the shopping bag, wish list & search sit vertically on tablet (in both landscape and portrait on tablet they are out of alignment).
I removed the styling to centre the main nav and still had this issue.
As you scroll down, the overlay nav displays correctly – its just the in page nav that’s out.

I want to have all the full nav for landscape tablet – but could have an earlier breakpoint for the mobile nav on portrait (if that makes sense).

ALso on portrait – the carousel images on ‘new arrivals’ don’t show up past the first image.

Cheers,
Lisa

Attachments:

You must be logged in to view attached files.

[Melanie – SUPPORT]

Hi,

reducing the font size to

nav .menu li {
font-size: 12px;
}

fixes it, so it’s merely a spacing issue.

Adjusting the spacing to

#main-nav .header-right ul.menu > li.menu-search > a {
padding: 12px 0px 20px 6px;
}
#main-nav .header-right ul.menu > li > a {
padding: 12px 0;
}

will make it shrink and not take as much space so it fits again.

[lis_locket]

Thanks for the suggestion – but a 12px font size is too small for the navigation – also i tried that along with your spacing fix and the layout still was out of line.

I either need to get the mobile navigation to kick in at a smaller screen or amend the spacing – at the tablet portrait screen.

Also i mentioned the issue with the carousel at the portrait size – you can see in the screenshot – it only shows up the first image in the carousel on tablet.

Thanks,
Lisa

Attachments:

You must be logged in to view attached files.

[Melanie – SUPPORT]

Hi, I was merely working on the navigation, can we make sure to have that covered before we take care of the carousel?

Please add the css to your website and let me know so I can check how far it takes us!