You are viewing this forum as a guest. Login to an existing account, or create a new account, to reply to topics and to create new topics.
Pages: 1 2
Did you see this screenshot Nick?
webmaster wrote:
Not sure I understand. Can you post a screenshot?
Offline
skin_widgetclass_SIDEMENU
webmaster wrote:
What class are you using for the 'product menu' in desktop mode?
Offline
Somewhere in your CSS either the left margin for the skin_widgetclass_SIDEMENU ul li ul is missing or set to zero. Fix your CSS and you'll be good to go.
Offline
Let me see if I can locate that line of code. I take it you mean the all.css file. Say nick, is it possible to create a drop down menu in the top menu area? What would that code look like?
webmaster wrote:
Somewhere in your CSS either the left margin for the skin_widgetclass_SIDEMENU ul li ul is missing or set to zero. Fix your CSS and you'll be good to go.
Offline
Change the group of the widget you want at the top to 'NAVMENU' and it's class to 'skin_widgetclass_NAVMENU'. Your CSS for the SIDEMENU was probably updated/changed in overrides.css, but could be in all.css.
Offline
Nick, when I say the top I mean the very top menu location above the header graphic, not the navmenu location. I tried that with the products group (old category menu) and it does make the related categories work, but does nothing to correct the related pages issue that is also affected. I'll have to try and check for this instance at issue in the overrides ccc file. When I tried to cxheck ther and in the all.cc yesterday I could not locate the item of which you spoke.
webmaster wrote:
Change the group of the widget you want at the top to 'NAVMENU' and it's class to 'skin_widgetclass_NAVMENU'. Your CSS for the SIDEMENU was probably updated/changed in overrides.css, but could be in all.css.
Here is the overrided.css code that should address this
/* +------------------------------------------------------------+ */ /* | Required Classes: Skin Widget - SIDEMENU | */ /* +------------------------------------------------------------+ */ .skin_widgetclass_SIDEMENU .skin_widgettitle { color: #000000; font-weight: bold; font-size: 12px; padding: 4px 6px 4px 6px; margin: 0px 0px 6px 0px; border: 1px solid #DEDEDE; background-color: #EFEFEF; -moz-border-radius: 6px 6px 6px 6px; -webkit-border-radius: 6px 6px 6px 6px; border-radius: 6px 6px 6px 6px; } .skin_widgetclass_SIDEMENU .skin_widgetcontent { margin: 0px 0px 20px 0px; padding: 6px 6px 6px 6px; border: 1px solid #DEDEDE; -moz-border-radius: 6px 6px 6px 6px; -webkit-border-radius: 6px 6px 6px 6px; border-radius: 6px 6px 6px 6px; background-image: url('../media/gradientup.png'); background-position: bottom left; background-repeat: repeat-x; } .skin_widgetclass_SIDEMENU .skin_widgetmenu ul { -moz-border-radius: 6px 6px 6px 6px; -webkit-border-radius: 6px 6px 6px 6px; border-radius: 6px 6px 6px 6px; } .skin_widgetclass_SIDEMENU .skin_widgetmenu li a { color: #333333; font-weight: bold; display: block; text-decoration: none; padding: 6px 6px 6px 16px; background-image: url('../media/fenav.png'); background-repeat: no-repeat; background-position: 6px 8px; } .skin_widgetclass_SIDEMENU .skin_widgetmenu li a:hover { color: #000000; text-decoration: none; } .skin_widgetclass_SIDEMENU .skin_widgetmenu li ul { width: 195px; margin: -26px 0px 0px 180px; -moz-box-shadow: 2px 2px 2px #555555; -webkit-box-shadow: 2px 2px 2px #555555; box-shadow: 2px 2px 2px #555555; } .skin_widgetclass_SIDEMENU .skin_widgetmenu li ul li { width: 195px; } .skin_widgetclass_SIDEMENU .skin_widgetmenu li:first-child a { border-top-left-radius: 6px; -moz-border-radius-topleft: 6px; -webkit-border-top-left-radius: 6px; border-top-right-radius: 6px; -moz-border-radius-topright: 6px; -webkit-border-top-right-radius: 6px; } .skin_widgetclass_SIDEMENU .skin_widgetmenu li:last-child a { border-bottom-left-radius: 6px; -moz-border-radius-bottomleft: 6px; -webkit-border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; -moz-border-radius-bottomright: 6px; -webkit-border-bottom-right-radius: 6px; }
Last edited by mdowning (08-15-2014 09:17:18)
Offline
This is the line governing the margin:
margin: -26px 0px 0px 180px;
For the menu styling, it's easiest to copy the HTML and CSS for a working menu, then duplicate/change class names, etc. in the CSS and HTML until you get your desired result. You really need to understand HTML and CSS to get a custom CSS dropdown menu working, even with the CCP examples as a starting point.
Offline
Ok, let me tinker with this setting in the over rides.css file. that seems to be the place that may be causing this issue to stand out. I am thinking that margin needs to be set like the rest of that class.
webmaster wrote:
This is the line governing the margin:
margin: -26px 0px 0px 180px;
For the menu styling, it's easiest to copy the HTML and CSS for a working menu, then duplicate/change class names, etc. in the CSS and HTML until you get your desired result. You really need to understand HTML and CSS to get a custom CSS dropdown menu working, even with the CCP examples as a starting point.
Offline
Nick, I'm not having any luck here. What do you charge to fix this one little nuisance issue?
Offline
Clickcartpro v8
Hi,
Currently I have 50 Categories under the 'shop by brand' menu on the frontpage under the main category so when they display they display in one long narrow box which means a lot of scrolling down.
I would like to change the display of these categories so that when I click on the main category the 50 subcategories are displayed in a wider table i.e in rows.
Would appreciate any assistance with this.
Many Thanks
Last edited by geneva66 (03-02-2016 06:25:05)
Offline
All of the pertinent CSS is referenced in this thread. I would imagine you'll want to expand the width of the ul's and then set the li's to a percentage width and float them.
Offline
Pages: 1 2