How can I center header.lower

Hi Everyone,
I hope I am asking in the right place. Apologies if I'm not...

My customer would like header.upper to stretch full screen the same as the footer, but wants the header.lower to be the same width as the menu etc...

I have been able to set the width of header.lower in style.css but when I refresh the page, the block is aligned to the left and looks way out of place.

Can someone please point me in the right direction so I can get header.lower to behave?

Thanks loads in advance.

Michael

Hello Michael,
If I may suggest to share with us your customization == share your store link.
Each template is a bit different (or even more), and issue you faced with may be cause by inherited from another element. So each case is different.

Regards,
Tomasz

My style.css

nopCommerce version 3.80

Site is www.tasting-spain.com. Just need to select the Arte Paella Theme at the bottom of the page.

Thanks


/*********** CSS RESET **********/


* {
  margin: 0;
  outline: none;
  padding: 0;
  text-decoration: none;
    font-family: Comfortaa, cursive;
}
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
html {
  margin: 0;
  -webkit-text-size-adjust: none;
}
ol, ul {
  list-style: none;
}
a img {
  border: none;
}

a:active {
  outline: none;
}
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
  margin: 0;
  border: 0;
  padding: 0;
}
input[type="button"],
input[type="submit"],
input[type="reset"],
input[type="text"],
input[type="password"],
textarea {
  border-radius: 0;
}
input[type="button"],
input[type="submit"],
input[type="reset"] {
    -webkit-appearance: none;
}
input:-webkit-autofill {
  -webkit-box-shadow: inset 0 0 0 1000px #fff;
}
script {
    display: none !important;
}


/*********** GLOBAL STYLES **********/



body {
    width: 100%;
    overflow-x: hidden;
    background-color: #fff;
    background-image: url("../images/Background-Tile-Small.png");
    font: normal 14px Arial, Helvetica, sans-serif;
    color: #000;
    
}
h1,h2,h3,h4,h5,h6 {
  color: darkred;
}
a {
  color: inherit;
  cursor: pointer;
}
a img {
  opacity: 0.99; /*firefox scale bug fix*/
}
table {
  width: 100%;
  border-collapse: collapse;
}
input[type="text"],
input[type="password"],
textarea, select {
  height: 36px; /*safari padding fix*/
  border: 1px solid #ddd;
  padding: 8px;
  vertical-align: middle;
}
input, textarea, select {
  font-size: 14px;
  font-family: Arial, Helvetica, sans-serif;
  color: #777;
}
textarea {
  min-height: 150px;
}
select {
  min-width: 50px;
  height: 32px; /*safari padding fix*/
  padding: 6px;
}
input[type="text"]:focus,
input[type="password"]:focus,
textarea:focus, select:focus {
  border-color: #ccc;
  color: #444;
}
input[type="checkbox"],
input[type="radio"],
input[type="checkbox"] + *,
input[type="radio"] + * {
  vertical-align: middle;
}
input[type="button"], input[type="submit"],
button, .button-1, .button-2 {
  cursor: pointer;
}
label, label + * {
  vertical-align: middle;
}

.master-wrapper-content {
    position: relative;
    z-index: 0;
    width: 90%;
    margin-right:10px;
    margin-left: 10px;
    background: #fff;
    border-radius: 10px;
}
.master-column-wrapper {
  position: relative;
  z-index: 0;
}
.master-column-wrapper:after {
  content: "";
  display: block;
  clear: both;
}
.center-1 {
  margin: 0 0 100px;
}
.center-2, .side-2 {
  margin: 0 0 50px;
}
.side-2:after {
  content: "";
  display: block;
  clear: both;
}

.page {
  min-height: 200px;
  text-align: center;
}
.page-title {
  min-height: 50px;
  margin: 0 0 25px;
  border-bottom: 1px solid #ddd;
  padding: 6px 10px;
}
.page-title h1 {
  font-size: 30px;
  font-weight: normal;
}
.page:after,
.page-title:after,
.page-body:after {
  content: "";
     /*display: block;
  clear: both;*/
       margin-left: 10px;
       margin-right: 10px;
}
.center-1 .page-title,
.center-1 .title {
  text-align: center;
}
.buttons {
  margin: 0 0 30px;
    
}
.link-rss {
  display: none;
  width: 24px;
  height: 24px;
  background: url('../images/rss.png') center no-repeat;
  font-size: 0 !important;
}
.category-description ul,
.manufacturer-description ul,
.full-description ul,
.topic-block ul,
.topic-page ul,
.post-body ul {
  margin: 12px 0;
  padding: 0 0 0 36px;
  list-style: disc;
}
.category-description ol,
.manufacturer-description ol,
.full-description ol,
.topic-block ol,
.topic-page ol,
.post-body ol {
  margin: 12px 0;
  padding: 0 0 0 36px;
  list-style: decimal;
}
.category-description p,
.manufacturer-description p,
.full-description p,
.topic-block p,
.topic-page p,
.post-body p,
.news-body p {
  margin: 10px 0;
  text-align: justify;
}
.flyout-cart {
  display: none;
}


/*********** GLOBAL FORMS ***********/



.fieldset, .section {
  position: relative;
  margin: 0 0 40px;
}
.fieldset .title,
.section .title {
  margin: 0 0 15px;
  padding: 0 10px;
  font-size: 20px;
  color: #444;
}
.fieldset .title strong,
.section .title strong {
  font-weight: normal;
}
.form-fields {
  position: relative;
  border-top: 1px solid #e6e6e6;
  background-color: #f9f9f9;
  padding: 30px 15px;
}
.inputs {
  position: relative;
  margin: 0 0 15px;
  text-align: center;
  white-space: nowrap; /*fix for 'required' elements*/
    font-size: 0;
}
.inputs:after {
  content: "";
  display: block;
  clear: both;
}
.inputs label {
  display: block;
  width: 100%;
  margin: 0 0 10px;
  text-align: center;
    font-size: 14px; /*reset zeroing*/
  color: #444;
}
.inputs input[type="text"],
.inputs input[type="password"],
.inputs select, .inputs textarea {
  width: 400px;
  max-width: 100%;
  background-color: #fff;
}

.inputs.custom-attributes {
  white-space: normal;
}
.inputs .option-list {
    display: inline-block;
  max-width: 95%;
    vertical-align: middle;
}
.inputs .option-list li {
  display: inline-block;
  margin: 5px;
  border: 1px solid #ddd;
  background-color: #fff;
  padding: 8px 10px;
}
.inputs .option-list label {
  display: inline-block;
  width: auto !important;
  margin: 0 0 0 5px;
}

.inputs.reversed {
  margin: 0 0 20px;
  text-align: center;
}
.required {
  margin: 0 -8px 0 3px; /*siblings offset*/
  vertical-align: top;
  font-size: 20px;
  font-weight: normal;
  color: #e4434b;
}
.message-error,
.field-validation-error,
.username-not-available-status,
.poll-vote-error, .password-error {
  display: block;
  text-align: center;
  font-size: 13px;
  color: #e4434b;
    margin-top: 5px;
}
.field-validation-valid,
.username-available-status {
  display: block;
  text-align: center;
  font-size: 13px;
  color: #4cb17c;
}

.captcha-box {
  text-align: center;
  line-height: 0; /*firefox line-height bug fix*/
}
.captcha-box > div {
  display: inline-block;
  max-width: 100%;
}
.captcha-box input {
  height: auto;
}


/*********** GLOBAL TABLES ***********/



.table-wrapper {
  overflow-x: auto;
}
.cart th,
.data-table th,
.forum-table th {
  border-width: 1px 1px 0;
  border-style: solid;
  border-color: #ddd;
    background-color: #f6f6f6;
    padding: 10px;
    white-space: nowrap;
  font-weight: normal;
}
.forum-table th.replies,
.forum-table th.views,
.forum-table th.votes,
.forum-table th.latest-post,
.forum-table th.topics,
.forum-table th.posts,
.forum-table td.replies,
.forum-table td.views,
.forum-table td.votes,
.forum-table td.latest-post,
.forum-table td.topics,
.forum-table td.posts{
    display: none;
}
.forum-table td.image {
    min-width: 0;
}
.cart td,
.data-table td,
.forum-table td {
  min-width: 50px;
  border-width: 1px;
  border-style: solid;
    border-color: transparent #ddd #ddd;
    background-color: #fff;
    padding: 20px;
  color: #444;
}
.forum-table td {
  min-width: 90px;
    padding: 10px;
}
.cart a,
.data-table a,
.forum-table a {
  font-weight: normal;
  color: #4ab2f1;
}
.cart a:hover,
.data-table a:hover,
.forum-table a:hover {
  text-decoration: underline;
}
.cart .product,
.data-table .product,
.data-table .message,
.data-table .info,
.data-table .name {
    min-width: 225px;
  text-align: left;
}
.forum-table .forum-details,
.forum-table .topic-details {
  text-align: left;
}
.cart .product a,
.data-table .product a,
.data-table .info a {
    font-weight: bold;
  color: #444;
}
.cart .product a:hover,
.data-table .product a:hover,
.data-table .info a:hover {
  color: #4ab2f1;
  text-decoration: none;
}

.cart .product .edit-item {
  margin: 10px 0 0;
}
.cart .product .edit-item a {
  font-weight: normal;
  color: #4ab2f1;
}
.cart .product .edit-item a:hover {
  text-decoration: underline;
}

.cart .remove-from-cart,
.cart .add-to-cart,
.data-table .select-boxes,
.data-table .order {
    text-align: center;
}

.cart td.unit-price,
.data-table td.unit-price {
    white-space: nowrap;
}
.cart td.quantity input {
    width: 50px;
    text-align: center;
}
.cart td.subtotal,
.data-table td.total {
  white-space: nowrap;
    color: #444;
}
.cart td.subtotal .discount {
    font-style: italic;
    color: #4ab2f1;
}

.data-table em a {
  font-weight: bold;
  color: #444;
}
.data-table div.download {
  margin: 10px 0 0;
}


/*********** NOTIFICATIONS & POPUPS  ***********/



.bar-notification {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
  padding: 15px 25px 15px 10px;
  line-height: 16px;
  color: #fff;
  opacity: 0.95;
}
.bar-notification.success {
  background-color: #4bb07a;
}
.bar-notification.error {
  background-color: #e4444c;
}
.bar-notification .content {
  margin: 0 10px 0 0;
}
.bar-notification .content a {
  color: #fff;
  text-decoration: underline;
}
.bar-notification .close {
  position: absolute;
  top: 0;
  right: 0;
  width: 32px;
  height: 32px;
  margin: 7px;
  background: #fff url('../images/close.png') center no-repeat;
  cursor: pointer;
}

.noscript {
    border-bottom: 1px solid #333;
    background-color: #ff9;
  padding: 30px 15px;
    text-align: center;
  line-height: 22px;
    color: #444;
}

.ajax-loading-block-window {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 999;
  width: 32px;
  height: 32px;
  margin: -16px 0 0 -16px;
  background: url('../images/loading.gif') center no-repeat;
}

.please-wait {
  background: url('../images/ajax-loader-small.gif') no-repeat;
    padding-left: 20px;
  font-size: 14px;
}

.ui-dialog {
  max-width: 90%;
  border: 1px solid #ddd;
  box-shadow: 0 0 2px rgba(0,0,0,0.15);
  overflow: hidden;
  background-color: #fff;
  /*override jQuery UI styles, do not delete doubled properties*/
  border-radius: 0;
  padding: 0;
  font: normal 14px Arial, Helvetica, sans-serif;
}
.ui-dialog:before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.5);
}
.ui-dialog-titlebar {
  border-bottom: 1px solid #ddd;
  overflow: hidden;
  background-color: #eee;
  padding: 10px 15px;
  /*override jQuery UI styles, do not delete doubled properties*/
  border-width: 0 0 1px;
  border-radius: 0;
  background-image: none;
  padding: 10px 15px !important;
  font-weight: normal;
  cursor: auto !important;
}
.ui-dialog-titlebar > span {
  float: left;
  font-size: 18px;
  color: #444;
  /*override jQuery UI styles, do not delete doubled properties*/
  margin: 0 !important;
}
.ui-dialog-titlebar button {
  position: absolute;
  top: 0;
  right: 0;
  width: 42px;
  height: 42px;
  border: none;
  overflow: hidden;
  background: url('../images/close.png') center no-repeat;
  font-size: 0;
  /*override jQuery UI styles, do not delete doubled properties*/
  top: 0 !important;
  right: 0 !important;
  width: 42px !important;
  height: 42px !important;
  margin: 0 !important;
  border: none !important;
  border-radius: 0;
  background: url('../images/close.png') center no-repeat !important;
  padding: 0 !important;
}
.ui-dialog-titlebar button span {
  display: none !important;
}
.ui-dialog-content {
  height: auto !important;
  padding: 15px;
  line-height: 20px;
  /*override jQuery UI styles, do not delete doubled properties*/
  background-color: #fff !important;
  padding: 15px 15px 20px 15px !important;
  color: #777;
}
.ui-dialog-content .page{
    min-height: 0;
}
.ui-dialog-content .page-title{
    min-height: 0;
    margin: 0 0 15px;
    padding: 0px 10px 10px 10px;
    text-align: center;
}
.ui-dialog-content .page-title h1{
    font-size: 24px;
    line-height: 30px;
}
.ui-dialog-content .back-in-stock-subscription-page {
    text-align: center;
}
.ui-dialog-content .back-in-stock-subscription-page .tooltip{
    margin-bottom: 10px;
}
.ui-dialog-content .back-in-stock-subscription-page .button-1{
  border: none;
  background-color: #4ab2f1;
    padding: 10px 15px;
  font-size: 15px;
  color: #fff;
  text-transform: uppercase;
}
.ui-dialog-content .back-in-stock-subscription-page .button-1:hover {
  background-color: #248ece;
}

.eu-cookie-bar-notification {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1050;
    width: 320px;
    height: 180px;
    margin: -90px 0 0 -160px;
    border: 1px solid #ccc;
    box-shadow: 0 0 2px rgba(0,0,0,0.15);
    background-color: #fff;
    background-image: url('../../../../Content/Images/AP-BG-Body.png');
    
    background-repeat: repeat;
    background-position: left;
    padding: 20px;
    text-align: center;
}
.eu-cookie-bar-notification .text {
  margin-bottom: 20px;
  line-height: 20px;
}
.eu-cookie-bar-notification button {
  min-width: 60px;
  margin: 5px 0 10px;
  border: none;
  background-color: #4ab2f1;
  padding: 8px 12px;
  font-size: 14px;
  color: #fff;
}
.eu-cookie-bar-notification button:hover {
  background-color: darkred;
}
.eu-cookie-bar-notification a {
  display: block;
  color: #4ab2f1;
}
.eu-cookie-bar-notification a:hover {
  text-decoration: underline;
}


/*********** HEADER ***********/



.admin-header-links {
  background-color: #333;
  text-align: center;
  color: #eee;
    
}
.admin-header-links * {
  display: inline-block;
  margin: 0 10px;
  line-height: 35px;
  font-size: 12px;
  font-weight: bold;
}
.admin-header-links .impersonate {
  display: inline-block;
}
.admin-header-links .impersonate a {
  background-color: #555;
  padding: 0 15px;
}
.admin-header-links .impersonate a:hover {
  background-color: #666;
}

.header {
    position: relative;
    z-index: 10;
    width: 95%;
    margin: 0 4px;
    text-align: center;
    
}
.header-upper {
  position: relative;
    z-index: 1;
  border-bottom: 1px solid #ddd;
    background-color: red;
}


.header-selectors-wrapper {
  border-bottom: 0px solid #ddd;
  padding: 10px 0;
    
}
.header-selectors-wrapper > div {
  display: block;
  width: 50%;
  margin: 10px auto;
  vertical-align: middle;
}
.header-selectors-wrapper select {
  width: 100%;
}
.language-list {
  max-width: 100%;
  font-size: 0;
}
.language-list li {
  display: inline-block;
  margin: 0 1px;
  vertical-align: middle;
}
.language-list a {
  display: block;
  position: relative;
  width: 24px;
  height: 32px;
  line-height: 0;
}
.language-list img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}

.header-links-wrapper {
  position: relative;
  padding: 20px 0;
}
.header-links {
}
.header-links ul {
  font-size: 0;
}
.header-links li {
  display: inline-block;
  margin: 0 10px;
}
.header-links span,
.header-links a {
  display: inline-block;
  font-size: 12px; /*reset zeroing*/
  line-height: 36px;
  text-transform: uppercase;
    color: white;
}
.header-links a:hover {
  color: #000;
    font-weight: 600;
}
#topcartlink {
  display: block;
  width: 70%;
  max-width: 400px;
  margin: 10px auto 0;
  /*background-color: hotpink;*/
  padding: 0 20px;
}
#topcartlink a {
  background: url('../images/shopping-bag.png') left center no-repeat;
  padding: 0 0 0 20px;
}

.header-lower {

    z-index: 0;
    padding: 35px 0;
    background: #fff;
    /*background-size: cover;
    background-position: center center;
    background-position-x: center;
    background-position-y: center;
        */
  
}

.header-logo {
  margin: 25px 0 40px;
  text-align: center;
}
.header-logo a {
  display: inline-block;
  max-width: 100%;
  line-height: 0; /*firefox line-height bug fix*/
}
.header-logo a img {
  max-width: 100%;
  opacity: 1;
}

.search-box form {
  display: inline-block;
}
.search-box form:after {
  content: "";
  display: block;
  clear: both;
}
.search-box input.search-box-text {
  float: left;
  width: 200px;
  height: 36px;
  margin: 0 -1px 0 0;
    border-radius: 10px;
}
.search-box .search-box-button {
  float: left;
  min-width: 86px;
  height: 36px;
  border: none;
  background-color: red;
  padding: 0 15px;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
    border-radius: 10px;
}
.search-box .search-box-button:hover {
  background-color: darkred;
}
.search-box .ui-autocomplete-loading {
  background: #fff url('../images/ajax-loader-small.gif') right center no-repeat;
}
.ui-helper-hidden-accessible {
  display: none !important;
}
.ui-autocomplete {
  width: 285px !important;
  border: 1px solid #ddd;
  border-top: none;
  overflow: hidden;
  background-color: #fff;
  text-align: left;
  /*override jQuery UI styles, do not delete doubled properties*/
  border-radius: 0;
  padding: 0;
  font: normal 14px Arial, Helvetica, sans-serif;
}
.ui-autocomplete li {
  border-top: 1px solid #ddd;
}
.ui-autocomplete li:first-child {
  border-top: none;
}
.ui-autocomplete a {
  display: block;
  padding: 15px;
  font-size: 14px;
  /*override jQuery UI styles, do not delete doubled properties*/
  margin: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  background: none !important;
  padding: 15px !important;
  line-height: normal !important;
  color: #777 !important;
}
.ui-autocomplete a:hover,
.ui-autocomplete a.ui-state-focus {
  background-color: #f6f6f6 !important;
}
.ui-autocomplete img {
  display: none;
  min-width: 20px;
  margin: 0 10px 0 0;
  vertical-align: middle;
}


/*********** FOOTER ***********/





.footer {
    background-color: #fff;
    text-align: center;
    /*background-image: url('../../../../Content/Images/Background-Tile.png');*/
    background-repeat: repeat;
    background-color: red;
  
}

.footer-upper {
  width: 95%;
  margin: auto;
  border-bottom: 1px solid #ddd;
  overflow: hidden;
  padding: 40px 0;
  font-size: 0;
}
.footer-block {
  width: 95%;
  margin: 1px auto;
  text-align: left;
  font-size: 14px; /*reset zeroing*/
    color: #FFF;
}
.footer-block .title {
  margin: 0 0 1px;
  background: #4ab2f1 url('../images/toggle-white.png') right center no-repeat;
  padding: 10px 15px;
  font-size: 20px;
  color: #fff;
  cursor: pointer;
}
.footer-block .title strong {
  font-weight: normal;
    color: #fff;
}
.footer-block .list {
  display: none;
  margin: 0 0 20px;
  color: white;
  padding: 10px 15px;
}
.footer-block .list a {
  display: block;
  padding: 10px 15px;
  line-height: 20px;
    color: white;
}
.footer-block .list a:hover {
  color: #4ab2f1;
}

.follow-us {
  margin: 30px auto 0;
  text-align: center;
}
.follow-us .title {
  margin: 0 0 10px;
  background: none;
  color: #fff;
  cursor: auto;
}
.follow-us .social ul {
  margin: 0 0 30px;
  border-bottom: 1px solid #ddd;
  padding: 0 0 30px;
  font-size: 0;
}
.follow-us .social li {
  display: inline-block;
  margin: 0 5px;
}
.follow-us .social a {
  display: block;
  width: 38px;
  height: 38px;
  background: url('../images/social-sprite.png') no-repeat;
  font-size: 0;
}
.follow-us .social .facebook a {
  background-position: 0 0;
}
.follow-us .social .twitter a {
  background-position: -38px 0;
}
.follow-us .social .rss a {
  background-position: -76px 0;
}
.follow-us .social .youtube a {
  background-position: -114px 0;
}
.follow-us .social .google-plus a {
  background-position: -152px 0;
}

.newsletter-email {
  display: inline-block;
  overflow: hidden;
}
.newsletter-email input[type="text"] {
  float: left;
  width: 180px;
  height: 36px;
  margin: 0 -1px 0 0;
}
.newsletter-subscribe-button {
  float: left;
  height: 36px;
  border: none;
  background-color: red;
  padding: 0 15px;
  text-align: center;
  color: #000000;
  text-transform: uppercase;
    border-radius: 10px;
}
.newsletter-subscribe-button:hover {
  background-color: darkred;
}
.newsletter-email .options {
    clear: both;
    padding: 10px 0 0;
}
.newsletter-validation,
.newsletter-result {
  width: 100%;
  overflow: hidden;
  line-height: 28px;
}
/*.newsletter-validation .please-wait {
  display: none !important;
}*/

.footer-lower {
  width: 95%;
  margin: auto;
  overflow: hidden;
  padding: 25px 0;
  font-size: 12px;
    color: #fff;
}
.footer-tax-shipping a {
  font-weight: bold;
  color: #fff;
}
.footer-tax-shipping a:hover {
  text-decoration: underline;
}
.footer-powered-by {
  margin: 10px 0 0;
}
.footer-powered-by a {
  font-weight: bold;
  color: #fff;
}
.footer-powered-by a:hover {
  text-decoration: underline;
}
.theme-selector {
  margin: 10px 0 0;
}
.theme-selector select {
  width: 170px;
}


/*********** SIDE COLUMN ***********/



.block {
  max-width: 600px; /*width limit in mobile*/
  min-height: 50px;
  margin: auto;
  text-align: left;
}
.block .title {
  position: relative;
  margin: 0 0 10px;
  border-bottom: 1px solid #ddd;
  background: #f6f6f6 url('../images/toggle-gray.png') right 14px no-repeat;
  padding: 12px 30px 12px 10px;
  font-size: 20px;
  color: #444;
  cursor: pointer;
}
.block .title strong {
  font-weight: normal;
}
.block .listbox {
  display: none;
  border-bottom: 1px solid #ddd;
  padding: 10px 5px;
}
.block .list li {
  padding: 5px 0 5px 15px;
}
.block .list a {
  display: inline-block;
  position: relative;
  padding: 5px 0;
  font-size: 16px;
  color: #444;
    -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
}
.block .list a:before {
  content: "";
  position: absolute;
  top: 12px;
  left: -15px;
  width: 5px;
  height: 5px;
  background-color: #ddd;
}
.block .list .active > a {
  color: #4ab2f1;
}
.block .list a:hover {
  color: #4ab2f1;
}
.block a.product-picture {
  display: none;
}
.block a.product-picture:before {
  display: none;
}
.block .sublist {
  margin: 15px 0 5px;
}
.block .sublist a {
  font-size: 14px;
}

.block .view-all {
  margin: 10px 0 0;
}
.block .view-all a {
  display: inline-block;
  padding: 10px 15px;
  font-size: 16px;
  color: #4ab2f1;
}
.block .view-all a:hover {
  text-decoration: underline;
}

.block .tags {
  margin: 5px 0 10px;
}
.block .tags ul {
  font-size: 0;
}
.block .tags li,
.product-tags-all-page li {
  display: inline-block;
  position: relative;
  margin: 0 10px;
  overflow: hidden;
  font-size: 17px !important; /*setting base size*/
}
.block .tags li a,
.product-tags-all-page li a {
  float: left;
  line-height: 30px;
  color: #444;
}
.block .tags li a:hover,
.product-tags-all-page li a:hover {
  color: #4ab2f1;
}

.poll strong {
  display: block;
  margin: 10px 0;
  background-color: #f6f6f6;
  padding: 10px 15px;
  font-size: 15px;
  font-weight: normal;
  color: #444;
  text-transform: uppercase;
}
.poll-options,
.poll-results {
  margin: 10px 0 15px;
  overflow: hidden;
  font-size: 15px;
  color: #444;
}
.poll-options li,
.poll-results li {
  margin: 10px 0;
}
.poll-options li > input {
  margin: 0 5px 0 0;
  cursor: pointer;
}
.poll-options li > label {
  display: inline-block;
  font-size: 16px;
  cursor: pointer;
}
.poll .buttons,
.poll-total-votes {
}
.poll .buttons input {
  border: none;
  background-color: #aaa;
  padding: 10px 20px;
  font-size: 13px;
  color: #fff;
  text-transform: uppercase;  
}
.poll .buttons input:hover {
  background-color: #bbb;  
}
.poll-total-votes {
  display: block;
  margin: 10px 0 0;
  font-weight: bold;
  font-style: italic;
  color: #444;
}

.home-page-polls {
  text-align: center;
}
.home-page-polls .title {
    border-bottom: 1px solid #ddd;
    color: #444;
    font-size: 30px;
    font-weight: normal;
    margin: 0 0 30px;
    padding: 0 0 15px;
}
.home-page-polls .title strong {
  font-weight: normal;
}
.home-page-polls li {
  display: inline-block;
  margin: 10px;
}


/********** CATEGORY PAGE **********/



.breadcrumb {
  margin: 0 0 50px;
  background-color: #f6f6f6;
  padding: 5px 10px;
}
.breadcrumb ul {
  font-size: 0;
}
.breadcrumb li {
  display: inline-block;
}
.breadcrumb li * {
  display: inline-block;
  margin: 0 5px;
  font-size: 14px; /*reset zeroing*/
  line-height: 32px;
}
.breadcrumb strong {
  font-weight: normal;
}
.breadcrumb a:hover {
  color: #4ab2f1;
}

.category-description,
.manufacturer-description,
.vendor-description {
  margin: 0 0 25px;
  line-height: 22px;
}

.contact-vendor {
  margin: 0 0 30px;
}
.contact-vendor .button-2 {
  border: none;
  background-color: #4ab2f1;
  padding: 10px 15px;
  font-size: 14px;
  color: #fff;
  text-transform: uppercase;
}
.contact-vendor .button-2:hover {
  background-color: #248ece;
}

.

I asked for URL, so do not need to add css here...

To the .header-upper (#728 at style.css) you may add

    width: 100vw !important;
    max-width: 100vw !important;
    left: calc(-50vw + 50%);

That is a trick, which should work.

Regards,
Tomasz

Hmmm Sorry about the CSS...

Ive added the code but there is no change.

Should that code have been put in header.lower?

Michael

mnc12004 wrote:
Have you refresh browser? CRTL+F5 will show you changes (or use incognito mode).

Regards,
Tomasz

Would you like a custom made WebsiteSolved header menu?
Here's a demo store link
http://nopcommerce-bootstrap4.websitesolved.co.uk/

nop4you wrote:

Hi Tomasz
Yes i did.

I had header.lower set to the correct width but left aligned. Needs to be centered.

I will keep tweaking and let you know if I'm succesful.

Michael

The usual way to center a block level element with CSS is just to set the left and right margins to auto:

.header-lower {
  margin: 0 auto;
}

It can depend on what else you've got going on in your CSS but try that before looking at anything more complicated.

petemitch wrote:

Hi Pete,
Thanks for that.

I also added width and max-width along with your suggestion and got the result I was after.

Thank you all for your help.

Michael