Hello
I have manage dto the the thin border line in the footer to a black/blue colour system but dont know how to add the same colour border round the menu banner where the categories go.
Is there an extra section I need to add to the CSS file because it is only one colour (blue)?
I want to be creative but my knowledge limits me lol so I am just trying to get a blue thin border round the menu banner and make the menu banner black with white or blue text.
The border seems the hard bit.
Any help would be highly appreciated.
I have manage dto the the thin border line in the footer to a black/blue colour system but dont know how to add the same colour border round the menu banner where the categories go.
Is there an extra section I need to add to the CSS file because it is only one colour (blue)?
I want to be creative but my knowledge limits me lol so I am just trying to get a blue thin border round the menu banner and make the menu banner black with white or blue text.
The border seems the hard bit.
Any help would be highly appreciated.
Total e-commerce newbie bravely testing OC v2.0.3.1 before rolling it live...getting there slowly, somehow. Maybe not. I dunno.
Hello Again
I have worked on the obvious part of the menu but I am now stuck.
I need to make the categories BOLD as the blue is not shining through the way I expected it.
I also need to add a border around the whole menu bar as per my post above but I am clueless as the CSS file doesn't seem to give me any clues either lol
Anyone able to help?
I have worked on the obvious part of the menu but I am now stuck.
I need to make the categories BOLD as the blue is not shining through the way I expected it.
I also need to add a border around the whole menu bar as per my post above but I am clueless as the CSS file doesn't seem to give me any clues either lol
Anyone able to help?
Attachments
Menu Banner
Total e-commerce newbie bravely testing OC v2.0.3.1 before rolling it live...getting there slowly, somehow. Maybe not. I dunno.
Depending on which browser you use, there are many extensions/add-ons which tell you what class and file for the spcific css are being used on a particular element by simply hovering over or clicking that element.
For FireFox, get the Firebug extension
For Google Chrome and Internet Explorer, I believe it is built-in - Simply right-click an element and choose Inspect Element
For FireFox, get the Firebug extension
For Google Chrome and Internet Explorer, I believe it is built-in - Simply right-click an element and choose Inspect Element
Thanks for this, your explanations always make senseuksitebuilder wrote:Depending on which browser you use, there are many extensions/add-ons which tell you what class and file for the spcific css are being used on a particular element by simply hovering over or clicking that element.
For FireFox, get the Firebug extension
For Google Chrome and Internet Explorer, I believe it is built-in - Simply right-click an element and choose Inspect Element

I have found the navbar but the text for the categories and styling etc is pulled form the generic body.home (if that makes sense) so when i change it, it applies the changes to all the text on the page... but I need it specific just to my categories... am I looking at the wrong element or is there an override?
Total e-commerce newbie bravely testing OC v2.0.3.1 before rolling it live...getting there slowly, somehow. Maybe not. I dunno.
Personally, I use firefbug for firefox for testing on the fly changes to styles etc. (Just a shame the resulting stylesheet cannot be saved easily after tinkering - I digress)
Using Firebug, I inspect a link on the menu
In the CSS panel of Firebug I can see that the following styles are present exactly on the menu link (around line 187 - 196 of stylesheet.css)
Perfect, there's one for normal state and one for when it is hovered
So I can now add whatever I want to those styles
i.e. font-weight: bold;
change the colour
etc
Using Firebug, I inspect a link on the menu
In the CSS panel of Firebug I can see that the following styles are present exactly on the menu link (around line 187 - 196 of stylesheet.css)
Code: Select all
#menu .nav > li > a {
color: #fff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
padding: 10px 15px 10px 15px;
min-height: 15px;
background-color: transparent;
}
#menu .nav > li > a:hover, #menu .nav > li.open > a {
background-color: rgba(0, 0, 0, 0.1);
}
So I can now add whatever I want to those styles
i.e. font-weight: bold;
change the colour
etc
now that explanation sir has made things extremely clearer!
Thank you so much for your valuable information and knowledge
Thank you so much for your valuable information and knowledge
Total e-commerce newbie bravely testing OC v2.0.3.1 before rolling it live...getting there slowly, somehow. Maybe not. I dunno.
Who is online
Users browsing this forum: No registered users and 7 guests