Float nav items in 4 corners

Suppose you have 4 items on Navigation: About, Services, Pricing, Contact.

You want to float these items in 4 corners:

About: top left
Services: top right
Pricing: bottom left
Contact: bottom right

You can use this code to Custom CSS box

nav>div.header-nav-item {
    position: fixed !important;
    z-index: 9999;
}
div.header-nav {
    display: block !important;
}
nav>div.header-nav-item:nth-child(1) {
    left: 2vw;
    top: 4vw;
}
nav>div.header-nav-item:nth-child(2) {
    right: 2vw;
    top: 4vw;
}
nav>div.header-nav-item:nth-child(3) {
    bottom: 3vw;
    left: 2vw;
}
nav>div.header-nav-item:nth-child(4) {
    bottom: 3vw;
    right: 2vw;
}

Note:

Left: space between text – left of screen
Right: space between text – right of screen
Top: space between text – top of screen
Bottom: space between text – bottom of the screen

Result:

Ask me a question, free