...

View Full Version : keeping menu at top of page



esthera
11-09-2006, 07:28 AM
I have a menu that is on top of my page in a div called menuhold

my content is then in a div called content


my css is

#menuhold {
position:fixed;
height:40px;
width:100%;

}

and for #content it has a padding-top:40px.


my problem is that when you scroll the menu stays on top as it should but it goes over the text. (in firefox)

what can I do to keep the menu on the top but without covering the text as I scroll in firefox.

Arbitrator
11-09-2006, 02:42 PM
I think that youíre going to have to be more specific. I understand whatís happening with regard to position: fixed but Iím not sure how what it is you want is different than what you already have. My guess would be that you want the #content element to scroll instead of the document itself? In that case, you donít need fixed positioning at all, but instead the overflow property to force the #content element to exhibit a scroll-bar.

esthera
11-12-2006, 12:37 PM
i now have


#menuhold {
/*position:fixed;*/
height:40px;
width:100%;

}
#menu {
height:30px;
text-align:center;
/*position:fixed; /*this will work in all modern browsers that support position:fixed*/*/
left:0px;
top:0px;
}
#content {
padding:40px 5px 5px 5px;
overflow:auto;
}


I want the menuhold to always appear at teh top of the page (even when scrolling) but the content to scroll.

what do I have to do to do this?

mark87
11-12-2006, 12:52 PM
Have a look at http://www.cssplay.co.uk/layouts/fixed.html :)

esthera
11-12-2006, 01:11 PM
this is what i had previously but i don't want the menu to go over the text.

I want it to be as if I had one frame for the menu and under the menu another frame with the text that changes according to the menu above it.

can i acheive this without using frames?

mark87
11-12-2006, 01:20 PM
Like http://www.cssplay.co.uk/layouts/bodyfix.html ?

Arbitrator
11-12-2006, 03:56 PM
Just so you know, you canít have a comment inside a comment since it is read as:



#menu {
height:30px;
text-align:center;
/*position:fixed; /*this will work in all modern browsers that support position:fixed*/*/
left:0px;
top:0px;
}

esthera
11-12-2006, 07:13 PM
i tried the fixed suggestion above but my links which are page.html#one etc (all aname links) are then not working. how can i get the links to open in the "frame" below.

Arbitrator
11-12-2006, 07:43 PM
i tried the fixed suggestion above but my links which are page.html#one etc (all aname links) are then not working.This doesnít say anything because you havenít provided any your code or a hyperlink to a Web document.


how can i get the links to open in the "frame" below.That sounds like you want a new page to open in the same page; thatís a job for frames. The only way to do that without frames is to include the contents of all the hyperlinks in that one document and selectively hide or show specific parts of the content (via JavaScript) when the hyperlinks are clicked. Obviously, that will mean your page will break when the user has JavaScript disabled.

kleinbaas
08-19-2010, 01:30 PM
I have a menu that is on top of my page in a div called menuhold

my content is then in a div called content

my css is

#menuhold {
position:fixed;
height:40px;
width:100%;

}

I wanted to make my top menu of my new Joomla site stay at the top of the window.. you know so that when you scroll down the menu says visible.

I thought this was going to be really hard, and prepared for the long mission to find a solution by backing up my site first etc. See what I mean at rlexample.stonedeer.co.uk - though this site is soon to be moved to www.larringtontrailers.com

This was the first post I found about the subject that made sense and I tried adding "position:fixed;" to the pillmenu css entry.

Whoalla! It worked perfectly! :-)

Thanks a bunch for your input! :-)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum