Width of div changes when position becomes fixed from relative

The width of the div "topNav" changes by few pixels when its position style is changed from relative to fixed. I found a jquery plugin (http://imakewebthings.github.com开发者_运维知识库/jquery-waypoints/) which can perform the same functionality I'm looking for elegantly, but I feel it is a overkill for this purpose.

EDIT: My question is how to avoid changing the div sizes.

Check out the code at :

http://jsbin.com/azace5/edit

---

You need to remove the page's "default margin". This will do it in "every browser":

html, body {
    margin: 0;
    padding: 0
}

See: http://jsbin.com/azace5/2

---

Or you can add a minimum width.

min-width:600px;