Padding different in chrome mac vs firefox and chrome pc

StackOverflow https://stackoverflow.com/questions/13335304

Question

I'm trying to align the navigation to the banner below on the website I'm creating here: http://35.9.51.41

I've been able to make it so it aligns in Chrome and Safari on my mac, and in IE, but it is still misaligned on Firefox or any PC using Chrome or Firefox. This is making my head turn. Any suggestions?

I have a padding the determines with width of the navigation here:

#nv-tabs a {
     padding:0 33px 0 34px;
     text-decoration:none;
     cursor: pointer; /* IE 7 bug-fix */
     color:#FFFFFF!important;
     display:block;
     background:none;
     line-height: 29px; 
     z-index:100;
     font-family: Arial, sans-serif;
     text-transform:uppercase;
     font-size:13px;
     font-weight:normal;
    }
Was it helpful?

Solution

Define a width and it should sort your problem and also look into box-sizing: border-box

OTHER TIPS

maybe try to use these functions, that define your browser and its version, and in your html tag you can write, <html class="<?php echo getBrowser();?>"> and after that in your css you can write styles for different browsers, e.g. if you are using chrome 23 you will have html tag like <html class="chrm chrm23">, so in your css you can write

.chrm .yourClass { /* properties here*/ }

function getBrowser() {
    global $_SERVER;

    $firefoxStart = strrpos($_SERVER['HTTP_USER_AGENT'], 'Firefox');
    $chromeStart = strrpos($_SERVER['HTTP_USER_AGENT'], 'Chrome');
    $safariStart = strrpos($_SERVER['HTTP_USER_AGENT'], 'Safari');

    if ($firefoxStart !== false){
        $version = $this->getVersion($firefoxStart, 8);
        return "ff ff" . $version;
    }elseif ($chromeStart !== false){
        $version = $this->getVersion($chromeStart, 7);
        return "chrm chrm" . $version;
    }elseif ($safariStart != false){
        $version = $this->getVersion($safariStart, 7);
        return "sfr sfr" . $version;
    }

}


   private function getVersion($start, $length){
        global $_SERVER;

            $end = strpos($_SERVER['HTTP_USER_AGENT'], ' ', $start);
            if ($end === false){
                $end = strlen($_SERVER['HTTP_USER_AGENT']);
            }

            $versionStr = substr($_SERVER['HTTP_USER_AGENT'], $start + $length, $end - $start - $length);
            $version = floatval($versionStr);
            $version = str_replace('.', '', $version);

            return $version;

    }
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top