Borders

This topic contains 3 replies, has 2 voices, and was last updated by  Sebastian 2 weeks, 6 days ago.

Author Posts

Lincsdigital

Hello

I’ve been looking at the demo of microthemer trying to set divider/ border on a navbar in between each menu item I managed to but a divider in to the navbar but don’t want it to be 100% height is it possible to reduce the height of the border to 50%?

Pete


Sebastian

Hey Pete,

It’s not possible to set the height of a right-hand border. It must be the height of the element. But the way people achieve the effect you desire is to use an ::after pseudo element, which can be styled into a divider.

The following video demonstrates how to do this:

http://somup.com/cqVw2YnbNK

One thing I forgot to mention in the video was my rationale for creating a selector that targets all menu links, and then modifying it so it doesn’t target the 2nd (and last) menu link. As opposed to just targeting the first menu item. It’s because using the system I implemented, any new menu items would have dividers between them automatically. You wouldn’t need to adjust the CSS. And the last menu item would never have a divider.

I hope that helps. Please let me know if you have any further questions.

Thanks!
Sebastian


Lincsdigital

Hi Seb

Thanks for answering my question so fully, just been on your site and purchased the lifetime licence of
Microthemer.

Thanks again.

Pete


Sebastian

You’re welcome. Thanks so much for the purchase Pete!

You must login or register to reply to this topic.