Placing DIV on SM style gallery page

[Allen]

I'm trying to place a nav div in a Smugmug style gallery to replace of the one I have now in the gallery description. Works great but way too much maintenance each month.

I think I have the one on the subcat pages set but having problems with freezing it to the right margin in Smugmug style so the position doesn't change when stretching.

one of the sub-cat pages. Typical of all Birds cat subcats
http://www.photosbyat.com/Birds/Birding-2009-June

All the subcat pages are identical so would an absolute position be better?
Positioning a relative div is tricky, using margins and not quite sure if that's the best way. But at least it works.


Another test. This seems to work for subcats testing with WebDev
...
...
.subcategory_Birding_2009_January #BirdJump09 {
display: block;
z-index:99;
position: absolute;
left: 530px;
top: 75px;
width: 320px;
background: #ccc;
padding: 5px;
border: 2px ridge #444;
text-align: center;
}

Another issue:
Currently #albumNav_top has increase in height after moving extra buttons there. Is there a way to control the height? Is that just the price to pay squeezing 10lbs in a five pound box.

[jfriend]

Doing it the way your are doing it is a bit risky. You've got the "Jump To" links in your custom header, but you're trying to use CSS to position them outside that header div and into some other div. As I'm sure you know, the only way to do that is with raw pixel offsets and getting it right depends upon the exact size of other divs (which you don't control). Those can vary with font changes, even from one browser to the next.

It is always better to find a way to get the new div actually into the layout flow so you can use normal and repeatable CSS layout rather than absolute positioning.

Unfortunately, Smugmug doesn't give you a way to add stuff to the category title are. So, you really only have three options that I know of:

The way you're doing it now.
Some custom Javascript to dynamically insert a div in the right place.
Use some javascript to move a div from your header to the right place.The category description customization (http://www.dgrin.com/showthread.php?t=135040) is one such piece of custom javascript and it could be used/adapated to do the second option as it is already adding a new div to the breadcrumb area. You would then have to put all your jump to lists into javascript rather than in your header. Neither is particularly elegant, though the category description method would be more foolproof from the page layout point of view.

The paypal customization code (http://www.dgrin.com/showthread.php?p=1087393#post1087393) is a customization that could be adapted to move a div from your header area to the right place.

[Allen]

Had it working real good in Firefox but for some reason IE6 would show all
three divs, very frustrating.


At least not as exciting as yesterday, turned on pc an kapow! Blew a cap in
the power supply.