Reduce width of vertical menu

A place for discussion about skinning and design. Before posting questions here you should review the documentation about creating skins.

5/8/2015 9:57:02 AM
Gravatar
Total Posts 56

Reduce width of vertical menu

I have designed a skin in Artisteer for my new site, and it features a vertical menu - you can see this at http://www.quizliverpool.org.uk/division-1-1.aspx - the vertical menu is the list of teams on the left hand side.  I would like to reduce the width of the menu to reduce the wasted white space between the menu and the page content.

I have looked through the css files, but cannot see what I need to change - is it the width of the first column?  Where would I set this? (it's a three column Artisteer layout as recommended). 

6/12/2020 11:59:51 AM
Gravatar
Total Posts 211
Community Expert

mojoPortal Hosting & Design @ i7MEDIA!

Re: Reduce width of vertical menu

Chris,

Assuming you're still using the same skin, the style for the width of the vertical menu is set on the .art-content-layout .art-sidebar1 {} class, which is currently "225px" on desktop and "auto" on mobile. Find/replace this in your skin to change the width, but beware that you don't override the mobile-specific style which is set with !important after it (which increases its CSS specificity by 100).