Hints to move Banner and Menu side by side

[Poggi]

Hi support:

I added a few enhancements to my site, like the BANNER and MENU as shown in a tutorial. It looks nice but I am wondering if I can have a example on how to make my bannwer and menu not to be alligned on the center but instead have it side by side with a Banner on the LEFT and the Menu on the RIGHT. The moonriver photography website inspired me to make something similar http://www.moonriverphotography.com/ . You can look at how my site looks at the moment www.poggiware.smugmug.com (http://www.poggiware.smugmug.com)

I managed to place the name of my categories, sub-categories and galleries at the botton instead of on the side. Currently it shows in a two columns and I am wondering if there is a quick was to show it with more columns. I would like to have the same accomplished on my Sub-Categories as well. I added th following CSS as seen on other thread. I wanted to make up to 6 galleries across insted of 4. I do not know the meaning of these numbers and hope someone could better explain it.

*=====Galleries 4 Across=====*/
.miniBox {width:122px; text-align:center; height:210px; margin:0 28px;}
.miniBox .photo {float:none; width:122px; height:auto; _height:1px;}
.miniBox .albumTitle {width:122px;}
.miniBox .description {width:122px;}
.miniBox .updated {width:122px;}
.loggedIn .miniBox {height:auto; min-height:300px;}
.loggedIn .miniBox .smbuttons {margin:0 auto; width:122px;}
.loggedIn .miniBox input {width:122px;}
.loggedIn .miniBox textarea {width:112px;}
.boxBottom .albumLarge {width:192px; height:350px; text-align:center; margin:0 24px;}
.albumLarge .photoLarge {float:none; width:192px; height:auto; _height:1px;}
.albumLarge .albumTitle {width:192px;}
.albumLarge .description {width:192px;}
.albumLarge .updated {width:192px;}
.loggedIn .boxBottom .albumLarge {height:auto; min-height:450px;}
.loggedIn .albumLarge .smbuttons {margin:0 auto; width:192px;}
.loggedIn .albumLarge input {width:192px;}
.loggedIn .albumLarge textarea {width:182px;}

Best Regards,

Poggi

[denisegoldberg]

Remove the 4-across code you have in your CSS and copy it again from the answer to # 10 in the Advanced Customization FAQ at http://www.dgrin.com/showthread.php?t=52811. It looks like something was copied incorrectly.

You have a loose entry in your CSS. Remove this, it doesn't do anything (except potentially cause problems) -

#extra_space

As far as changing so your banner and navbar are side-by-side, your current banner / navbar combination is much too wide to pull that off nicely. I recommend making a smaller banner, and removing some of the navbar entries. You could make a "galleries" entry to jump to a screen showing all categories, which would remove the need for quite a few of the entries on your navbar. Tutorial for that is here - http://dgrin.smugmug.com/gallery/2160039. Follow the instructions in the sections title The Galleries.

If you want to keep your navbar as is, then I don't recommend going to a side-by-side look.

--- Denise

[Poggi]

Remove the 4-across code you have in your CSS and copy it again from the answer to # 10 in the Advanced Customization FAQ at http://www.dgrin.com/showthread.php?t=52811. It looks like something was copied incorrectly.

You have a loose entry in your CSS. Remove this, it doesn't do anything (except potentially cause problems) -

#extra_space

As far as changing so your banner and navbar are side-by-side, your current banner / navbar combination is much too wide to pull that off nicely. I recommend making a smaller banner, and removing some of the navbar entries. You could make a "galleries" entry to jump to a screen showing all categories, which would remove the need for quite a few of the entries on your navbar. Tutorial for that is here - http://dgrin.smugmug.com/gallery/2160039. Follow the instructions in the sections title The Galleries.

If you want to keep your navbar as is, then I don't recommend going to a side-by-side look.

--- Denise

Hi Denise:

I changed the code as available in the anser #10 and it worked OK. I also removed the extra code below:


#extra_space


In addition, I reduced the number of menu entries. I am wondering how I should proceed to have the menu side by side with the banner. I also noticed that when I click on Poggiware in the breadcrumb I get re-directed to www.poggiware.smugmug.com instead of www.poggiware.smugmug.com/galleries. I am wondering if I can force the breadcrumb to go to the galleries insted of initial screen.


Thanks,

Poggi