Search code examples
htmlcssmenubar

Aligning the menu bar closer to web


I'm a newbie to web development and I'm learning HTML and CSS right now. I'm using Firefox 18 and I want to have a menu bar close to the browser's header (pretty much like Facebook's blue menu bar).

Though I have created the menu bar, I have issues aligning it. My questions: 1. How do I reduce the space on Top, right and left, so that the menu bar fits snugly into the Firefox? I tried padding but it only alters the space between items on the menu bar and not how the bar is aligned. 2. Will resizing the browser have any effect on the way the bar is displayed? Is it a browser property or can I un-resize the menu bar from the code I've written?

Thanks!


Solution

  • You need to add

    * { margin: 0; padding: 0; }
    

    at the top of your css

    --- or ---

    use a reset

    The goal of a reset stylesheet is to reduce browser inconsistencies in things like default line heights, margins and font sizes of headings, and so on.

    http://meyerweb.com/eric/tools/css/reset/