Please believe me that I have searched the forums and played with the header.tpl and stylesheet.css to find how to do this, but I can't.
Here's the site: http://www.leahinc.com. The theme template is Dark Purple from @dswww. I have not found a way to contact dswww.
I need to do 3 things:
1. Move the menu/nav bar up. There is too much space between the logo / home, wish list etc, and the menu bar.
2. Center the text on the menu bar
3. Fix the drop down products menu, because it's got a gap between the menu itself and the drop down list.
Can someone tell me which file and what lines to adjust to get those done?
Here's the site: http://www.leahinc.com. The theme template is Dark Purple from @dswww. I have not found a way to contact dswww.
I need to do 3 things:
1. Move the menu/nav bar up. There is too much space between the logo / home, wish list etc, and the menu bar.
2. Center the text on the menu bar
3. Fix the drop down products menu, because it's got a gap between the menu itself and the drop down list.
Can someone tell me which file and what lines to adjust to get those done?
1. Edit your stylesheet.css, header section and change the height: 150px to height: 110px; or similarLeahStorm2 wrote:
I need to do 3 things:
1. Move the menu/nav bar up. There is too much space between the logo / home, wish list etc, and the menu bar.
2. Center the text on the menu bar
3. Fix the drop down products menu, because it's got a gap between the menu itself and the drop down list.
Can someone tell me which file and what lines to adjust to get those done?
2. & 3. require edits in the menu section of stylesheet.css. Look at the ul and li sections.
Running Opencart v3.0.3.2 with multi-stores and the default template from https://www.labeshops.com which has links to all my stores.
THANK YOU! I managed to get the first 2 issues fixed. Thank you.
For others who need this:
For others who need this:
Code: Select all
#header {
margin:0 auto 0 auto;
padding:0;
width:980px;
height: 110px; <------------- changed from 150, and it moved menu bar up.
margin-bottom: 7px;
padding-bottom: 4px;
position: relative;
z-index: 99;
Code: Select all
.menu > ul > li > a {
margin:0;
font-size: 14px;
color: #fff;
text-decoration: none;
font-weight:normal;
display: block;
padding: 13px 15px 16px 15px; <---------------- 13px was 23px. Centered text on menu bar.
z-index: 6;
position: relative;
I still can't figure out how to get the drop down menu closer to the menu bar itself. I've tried tons of changes, but they all changed other stuff. Do you have any ideas where that might be?
Code: Select all
/* menu */
#menu {
background:url('../image/menu-bg.png') repeat-x;
border-bottom:none;
height: 43px;
width:100%;
padding:0;
}
.menu{
margin:0 auto 0 auto;
padding:0;
width:980px;
}
.menu ul {
list-style: none;
margin: 0;
padding: 0;
}
.menu > ul > li {
position: relative;
float: left;
z-index: 20;
}
.menu > ul > li:hover {
}
.menu > ul > li > a {
margin:0;
font-size: 14px;
color: #fff;
text-decoration: none;
font-weight:normal;
display: block;
padding: 13px 15px 16px 15px;
z-index: 6;
position: relative;
}
.menu > ul > li > a:hover{
background:none;
color:#000;
border:none;
-webkit-border-radius: 7px 7px 7px 7px;
-moz-border-radius: 7px 7px 7px 7px;
-khtml-border-radius: 7px 7px 7px 7px;
border-radius: 7px 7px 7px 7px;
}
.menu > ul > li > div {
display: none;
position: absolute;
z-index: 5;
padding: 5px;
border: 1px solid #000;
-webkit-border-radius: 0px 0px 5px 5px;
-moz-border-radius: 0px 0px 5px 5px;
-khtml-border-radius: 0px 0px 5px 5px;
border-radius: 0px 0px 5px 5px;
background: url('../image/menu.png');
}
.menu > ul > li:hover > div {
display: table;
}
.menu > ul > li > div > ul {
display: table-cell;
}
.menu > ul > li ul + ul {
padding-left: 20px;
}
.menu > ul > li ul > li > a {
text-decoration: none;
padding: 5px;
color: #FFFFFF;
display: block;
white-space: nowrap;
min-width: 120px;
}
.menu > ul > li ul > li > a:hover {
background: #000;
color:#fff;
}
.menu > ul > li > div > ul > li > a {
color: #FFFFFF;
try changing the bottom padding on:
padding: 13px 15px 16px 15px;
so change the 16px to like 10px.
I think that is where it is coming from my my firebug is being stupid on trying to adjust it.
padding: 13px 15px 16px 15px;
so change the 16px to like 10px.
I think that is where it is coming from my my firebug is being stupid on trying to adjust it.
Running Opencart v3.0.3.2 with multi-stores and the default template from https://www.labeshops.com which has links to all my stores.
OH WOW... I seriously thought I tried that one.
You are a genius. I also tried firebug and couldn't see exactly what it was.
Thank you!!!
You are a genius. I also tried firebug and couldn't see exactly what it was.
Thank you!!!
No problem
Yeah, firebug seems to get wonky with nested css classes Inspecting the menu text element though I could see the box for it was much deeper than it needed to be and lined up with the top of the drop down window which is what gave me the clue.
Yeah, firebug seems to get wonky with nested css classes Inspecting the menu text element though I could see the box for it was much deeper than it needed to be and lined up with the top of the drop down window which is what gave me the clue.
Running Opencart v3.0.3.2 with multi-stores and the default template from https://www.labeshops.com which has links to all my stores.
Who is online
Users browsing this forum: No registered users and 77 guests