0

/*CSS for line*/

#line{
 position: absolute;
 top: 181px;
 height: 1px;
 width: 100%;
 background-color: #E2E2E2;
}
HTML:
<div id="line">&nbsp;</div>

I made a 100% width 1px line element using &nbsp to run through the bottom of my horizontal navigation menu - it was all fine until I tried it out in Safari and saw that it was off by 5 pixels, when I adjusted accordingly, it became off in Chrome and IE by 5 pixels - is there a way to mediate the problem to satisfy all three browsers?

j08691
  • 204,283
  • 31
  • 260
  • 272
BlueBizen
  • 1
  • 3

1 Answers1

0

You could determine your browser, and depending on your browser you can add a class to your <body>. Then you can define separate css rules for the different browsers. For instance, if your browser is safari and safari is the class, then:

body.safari #line {
    /*...*/
}

and so on with the other browsers as well.

EDIT:

In php you can use get_browser() in a function to determine the browser.

In Javascript the value you are looking after is navigator.appName.

Community
  • 1
  • 1
Lajos Arpad
  • 64,414
  • 37
  • 100
  • 175
  • Thanks, that really is a can of worms~ it looks like I would need httaccess and php and everything to run that detection script. – BlueBizen Nov 10 '14 at 14:58
  • You can do it with Javascript only as well, using this value: navigator.appName. You can define a function which returns browser name based on navigator.appName. You can call this function after the page is loaded with javascript and add the resulting class to body. htaccess is not needed here as well. You can detect the browser either from php or javascript and you can add the class to body when you generate it on server with php or after page load with javascript. It is up to you. – Lajos Arpad Nov 10 '14 at 15:27
  • I looked into it and tried navigator.appName and I get netscape for most browsers--- But I managed to fix the problem by just re-doing all my div's - segregating the header from the body, and then making subdivs to define content width, but keeping that 100% width line in the broader div. Thanks! – BlueBizen Nov 11 '14 at 21:40