Hello,
Does anyone knows the Custom CSS to extend the menu bar to full browser width?
I know to centre-align the menu links, CSS is:
@media (min-width: 768px) {
#menu .nav {
float: none;
text-align: center;
}
#menu .nav li {
display: inline-block;
float: none;
}
}
Does anyone knows the Custom CSS to extend the menu bar to full browser width?
I know to centre-align the menu links, CSS is:
@media (min-width: 768px) {
#menu .nav {
float: none;
text-align: center;
}
#menu .nav li {
display: inline-block;
float: none;
}
}
Your Local Store.
http://www.frishops.ca
http://www.frishops.cn
checked already, how others are doing this ?
---
Full width homepage by GrandCMS.com
http://www.opencart.com/index.php?route ... e=GrandCMS
---
or check here for more:
http://www.opencart.com/index.php?route ... ll%20width
---
Ernie
---
Full width homepage by GrandCMS.com
http://www.opencart.com/index.php?route ... e=GrandCMS
---
or check here for more:
http://www.opencart.com/index.php?route ... ll%20width
---
Ernie
My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.
Hey thanks for the links.
I've tried many, but most of them is full width only. What I want is full-browser width, the same as the top bar.
Vince
I've tried many, but most of them is full width only. What I want is full-browser width, the same as the top bar.
Vince
Your Local Store.
http://www.frishops.ca
http://www.frishops.cn
The easiest way i can see is to edit your header.tpl file
Find
and change "container" to "container_cats" or whatever you want to , then just add some styling to it.
Find
Code: Select all
<?php if ($categories) { ?>
<div class="container">
Hey Thanks a lot.cyclops12 wrote:The easiest way i can see is to edit your header.tpl file
Findand change "container" to "container_cats" or whatever you want to , then just add some styling to it.Code: Select all
<?php if ($categories) { ?> <div class="container">
What is the code for full-browser width?
Your Local Store.
http://www.frishops.ca
http://www.frishops.cn
I just tested this on 2.0.3.1 and works ok
In catalog/view/theme/YOUR-THEME/template/common/header.tpl and find around lines 91-93
Then i changed <div class="container"> to <div class="container-cats">
so now looks like this
Then in catalog/view/theme/YOUR-THEME/stylesheet/stylesheet.css i made a space under the body css code and added
You can obviously change the name to whatever you like
You may have to add some media css styling as well
In catalog/view/theme/YOUR-THEME/template/common/header.tpl and find around lines 91-93
Code: Select all
<?php if ($categories) { ?>
<div class="container">
<nav id="menu" class="navbar">
so now looks like this
Code: Select all
<?php if ($categories) { ?>
<div class="container-cats">
<nav id="menu" class="navbar">
Code: Select all
.container-cats {
width:100%;
}
You may have to add some media css styling as well
Code: Select all
<?php if ($categories) { ?>
<div class="container-fluid">
http://v4-alpha.getbootstrap.com/layout ... containers
Ah i didnt think of that but you would still have to go into the correct bootstrap.css file and remove the left and right padding to get it FULL widthmikesch70 wrote:Use Bootstrap!Code: Select all
<?php if ($categories) { ?> <div class="container-fluid">
http://v4-alpha.getbootstrap.com/layout ... containers
Hey,
Thanks guys for the help. I really appreciate it.
Thanks guys for the help. I really appreciate it.
Your Local Store.
http://www.frishops.ca
http://www.frishops.cn
Who is online
Users browsing this forum: No registered users and 68 guests