Top Menu bar modification

[Jaje]

Hi guys,

 

I am trying to modify the top menu bar but I am stuck and I need help. I have 4 links on it "home", "contact", "info" and "delivery". I am trying to modify border-radius while hovering on the first and last item. I was trying to modify superfish-modified.css but I didn't manage to do it. I know I have to create a class and assign it to the specific item, but my knowledge in that area is limited and any help would be more than welcome!

[vekia]

we need additional information about your store:

1. what prestashop version you use ?
   
2. what module for top menu you use ?
   

[Jaje]

I am using default Top Horizontal Menu version 1.5

Prestashop 1.5.4.1

[vekia]

superfish-modified.css

 

add new class:

 

.sf-menu li.firstitem:hover {
visibility: inherit;
border-radius:4px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
}

 

then assign firstitem to the first element in the menu

 

the same for last item - if you want different style - create another class

[Jaje]

Thank you Vekia, I've created the class but I have trouble finding the first element to assign it to.

[vekia]

Your website is online? The url will be really helpfull for me

[vekia]

ok, i know how you can modify it:

 

.sf-contener li:first-child {
   background:red;
}
.sf-contener li:last-child {
   background:blue;
}

 

let me know if this works for you

[Jaje]

Thank you! Works fine!

[rajj]

Dear vekia,

 

I am trying to learn and test using the Prestashop 1.6.0.9 and "default-bootstrap". But I am not able to change or modify some blocks like  at the top , contact block (Background color), Footer background color. 

 

Also I want to display category list on the home page and just beside home slider.

 

Please help to modify.

 

Thanks