Tweaking the side menu

[cheilenereinfo]

Hi, I have this page http://www.cheilenereinfo.ro/handmade/

I found two scripts and combined the website and the left side menu.
My css knowledge are very…but very low, so, if possible, please help me sove this problem.

I have these two pictures, with the closed and opened menu and some information regarding my needs.

closed menu: http://cheilenereinfo.ro/handmade/closed_menu.jpg

opened menu: http://cheilenereinfo.ro/handmade/opened_menu.jpg

All I need is to have that menu visible. When opened, it appears over the pictures and the menu cannot be seen. What can I do to place the menu in the white space, between the left side of the website and the picture gallery? Waht do I have to change or what code do I need to add? Can this be done?

Thanks

[Paulie_D]

That’s a very complicated question.

This is javascript driven so there a probably a lot of changes that need to be made or added to that script.

It’s not an easy CSS fix.

At the very least, you would have to move the container over by the width of the menu or narrow it by the same amount.

[cheilenereinfo]

Is there a way, maybe, to move the entire website layout a little bit to the right? Could this be a solution?

[Paulie_D]

It depends on what you mean by…

move the entire website layout a little bit to the right

You could add padding to the main div but it’s not really going to look quote right when the menu is not shown.

main {
  -webkit-transition: opacity 0.6s;
  transition: opacity 0.6s;
  padding-left: 300px;

[cheilenereinfo]

Yes, you’re right. I used Firebug to see the changes…it moves the entire gallery, and it looks ok when opening the menu, but when the menu is closed, there is a larger white space. I made the changes, and updated the website for the moment. Now i’ll have to shorten the space between the menu items and make them look a little bit compact.

[Paulie_D]

The option would be to amend the main CSS when the menu is clicked and re-set it when it’s clicked closed.

But that’s something that Javascript would be required for..I think.

[cheilenereinfo]

http://cheilenereinfo.ro/handmade/

I changed the menu icons and moved the title to the left.

For the moment , I’ll leave it as it is.

What do you think?

Thanks Paulie_D for your help.

[Paulie_D]

For me the icons are a little too large and ‘in your face’ but that’s a personal opinion only.

[Author]

Posts