1 reply [Last post]
jace1319
jace1319's picture
Offline
Regular
Last seen: 3 years 17 weeks ago
Timezone: GMT-4
Joined: 2011-01-10
Posts: 41
Points: 61

Hello,

It's been awhile since the last time i used css. Now I'm back but I'm having issues trying to center my navigation bar. Any ideas on how i can fix this problem? Thanks in advance

/*================ Nav Bar ================*/
.nav-bar {
position: relative;
border-top: 1px solid $color-header-border;
background-color: $color-header;
z-index: $z-index-stickynav;
left: 50%;
right: 50%;
text-align: center;

// psuedo element sits above meganav dropdown, but below nav links
&:after {
content: '';
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
background-color: $color-header;
pointer-events: none;
z-index: $z-index-nav-links - 1;
}
}

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 11 hours 33 min ago
Dallas
Timezone: GMT-5
Joined: 2004-06-25
Posts: 9743
Points: 3822

Why the position property?

The position property is normally a last resort except for minor elements. We do need to see the marked up content, as styles mean nothing without the html to apply it against.

Using position offsets was primarily a work-around for IE6's stupidity and has no business in code for a modern browser.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.