Fixed Header Not Working
 

I followed the directions in the closed posts on Fixed Header as follows:

In ADD CSS: #header (position: fixed;)

Nothing happens; header still not fixed.

I don't know what happened but I had posted:

#header (position: fixed;)

you don't use parentheses () in CSS...you use squiggle brackets {}

JUGGLEDAD, Thank you. That worked.

Now it changed the header itself. Horizontally the header is only half and cutoff. Also, the rest of the page moved up behind the header rather than remained below it.

What do I need to tweak?

Thanks.

What is the url?

you need to set a width on the div.header-image-container
You will also have to play with some other area's. You might want to look at this thread

JUGGLEDAD, Thank you.

Tomorrow i will tackle this including your directions in the linked posting on the same subject.

I added the following to CSS Inserts:

div#wrapper { position: relative; top: 185 px; }

I did not set the width on the div.header-image-container since I could not figure out where to do that.

I just tried something else with the div#header as follows:

position: fixed; top: 0; width 100%; z-index: 2000;

Now it works except for the horizontal size of the header.

go to ATO->Export/Import and do an export and attach the file to a reply (use the paper clip icon)

I'm wondering that if I do your suggested div.header-image-container that it might solve the problem?

Try adding this
You probablyl need to adjust things and deal with the footer also.

I added them as ADD CSS. No change.

I don't see that css on your site. did you remove it?

OOPS! I goofed. When it did not work I removed it.

I just put it back in and it restored the heading! Thank you!

It did create some other problems as follows:

1. On each page, there is now a large gap between the page and the header.
2. The side borders only go down part of the way.
3. The footer is gone.

Yup, this is what happens when you start messing around. One change causes another issue and it's fix causes another...

Are you using a code examiner like the FireBug extension in Firefox? If not, you should, you can examine elements, see the CSS applied to it and dynamically change it to see what happens.

to debug this, take out the CSS and add it in a bit at a time and see what is causing the issues and address each one separately.

I followed your suggestion and finally it's working right. I did it by commenting out the following:

td#middle,
td#right {
position: relative;
top: 205px;

Thank you, JUGGLEDAD!

I noticed that even after SAVING CHANGES, when I select to VISIT WEBSITE it displays incorrectly by putting the editing options on top of the start of the header. I have to go outside the editing and then access the actual website so it shows correctly with the changes made. Is this how it normally works?

beats me, I always have two tabs in my browser: one for the backend and one for teh front end. I make a change, hit save and swap tabs and hit refresh.