I'm working in firefox...not sure if it is browser dependent.

Olof just verfied in Chrome as well.

I'm trying to get my CSS displaying pixel perfectly. I zoom in too look at it. I'm having a problem such that the border I have on a top bar disappears at high zoom. Not too sure why this is happening or what I can do to fix it.

Here is the fiddle:

<http://jsfiddle.net/DsNr2/>

Here is the screenshot from the fiddle

![enter image description here](https://i.stack.imgur.com/qtseJ.png)

Note you have to zoom in to see the border disappear.

I would expect to see the border from one side of the screen to the next but is stops in between...when you zoom in.

I'm not so much concerned with a user needing to zoom in (Control + on Firefox) but more for my own development needs and verifying everything is in place.

The top bar elements have been removed in the fiddle to narrow down to the causing agent.

Here is code from fiddle

```
<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
MODULE - NORMALIZE/ALL
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->

<style>
body{
  padding:  0px;
  margin:  0px;
  background:  #bfddec;
  line-height: 100%;
}

#A{
  background:  -moz-linear-gradient(top, #009fd0, #008db8);
  background:  -webkit-linear-gradient(top, #009fd0, #008db8);
  border-bottom:  1px solid #007fa5;
}
#Aa{
  position:  relative;
  width:  1000px;
  height:  40px;
  margin-left:  auto;
  margin-right:  auto;
  background:  -moz-linear-gradient(top, #009fd0, #008db8);
  background:  -webkit-linear-gradient(top, #009fd0, #008db8);
}

</style>

<!-- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
MODULE - HEADER
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -->

<div id='A'>
  <div id='Aa'>
  </div>
</div>

```