Absolutle Positioned Navigation bar in a Float Layout

Posted on 2009-04-07
Last Modified: 2012-05-06
I am trying to get navigation bar to be absolute positioned.  However, when I resize the browser the navbar moves. How do I keep it in place?  See Link
html, body {
  font-family: sans-serif;
  margin: 0;
  padding: 0;
  border: 0;
body { background-color: rgb(250,250,250)};
h1 {
font-family: Trebuchet MS;
font-size: 24px;
font-weight: normal;
color: rgb(47, 79, 79);
#main {
  width: 800px;
  max-width: 1000px;
  height: 600px;
  margin: 2em auto;
  padding: 1em;
#logo {
margin-top: 50px;
#buttons {
	position: absolute;
	top: 184px;
	right: 182px;
	width: 349px;
#footer {
font-size: 70%;
text-align: center;
line-height: normal;
margin-top: 30px;

Open in new window

Question by:Albee_J
  • 2
LVL 13

Expert Comment

ID: 24093058
On the link provided the #button is positioned relative with top of -180px.

Please check and provide feedback


Accepted Solution

Albee_J earned 0 total points
ID: 24095935
I got it to work by futzing around with it.  I changed it from absolute to relative.

Author Comment

ID: 24095949
I posted to quickly in here. Sorry...

Featured Post

PRTG Network Monitor: Intuitive Network Monitoring

Network Monitoring is essential to ensure that computer systems and network devices are running. Use PRTG to monitor LANs, servers, websites, applications and devices, bandwidth, virtual environments, remote systems, IoT, and many more. PRTG is easy to set up & use.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
How to create a 3-column full-width flex button layout 1 32
Why my select dropdown does not work? 8 41
css issues with IE 11 8 37
div to fit another div 8 23
As a result of several questions about how to use Bootstrap I thought it would be a good idea to write down the development aspect of creating a Bootstrapped website in as little time as possible. Part 1 of this article will only concentrate on g…
Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…

825 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question