How do I change so it dont move when I resize the window?

Get Started
1

Hello I want to add a menu that don’t move with the side of the browser when I re-size it. I want it to stay in that one position relative to my text. What css do I use? Thanks in advance.

2

In a sense, it should do that without CSS at all. It sounds like you are using position: absolute or something like that, which is generally not a good way to go.

We really need to see a live link, or the code you are suing, to be much help. :slight_smile:

3

Ok. Thank for the reply. Well please look at

[My Website](http://serverflare.com/main website/)

The “Team Member One…” moves with the left side of the browser when I increase the horizontal width of the browser.

Thanks in advance

4

Sorry - I’m not sure what you’re asking. Are you saying you’d like the menu with the team members to be centred horizontally, rather than left-aligned as at present?

5

Sorry for not being clear. I want the team member to stay put when I resize the window. Thanks

6

The first thing you shoud do is remove the huge width here:

#smallInforBar {
  display: inline-block;
  width: [COLOR="#FF0000"]7000px[/COLOR];
}

That’s not helping your cause at all. If you remove it, the member boxes stay still in relation to the text.

7

I’ve made the changes and it dosn’t seem to be working.

Also I’ve notice another problem when I click on the top Navigation Menu, it does not highlight the selected. For example when I select Home. The Service Tab is highlighted. When I click anything else the Service tab is selected.

8

That’s because you have the class “active” applied to the Services <li> on each page.

<li class="active">
<a href="home.html">Services</a>
</li>

You need to remove it from the Services <li> and apply it to the current page <li> on each page.

I hope that makes sense - it sounds a little garbled to me. (:

9

Awww thanks, that helped. I’m going to change it now =)

One issue down one more to go =) Hehehe this is the most productive/helpful forum on the internet, from experience.

10

I meant just to delete the width, not thw whole rule. So put this back in:

#smallInforBar {
  display: inline-block;
}
11

Bingo!!! Thank you so much guys. Really helped me a lot.

12

Just be careful of older browsers, like IE7 and under. They may need display: inline instead, if you care about them (I don’t). :slight_smile:

13

I don’t care for people with IE7 either they should just upgrade.