Author Topic: Making Background Headerstrip Colour Full Width?  (Read 8158 times)

Offline jimmyjazz

  • Newbie
  • *
  • Posts: 7
  • Karma: +1/-0
    • View Profile
Making Background Headerstrip Colour Full Width?
« on: December 26, 2013, 04:57:17 AM »
Using HTML5 theme I have already changed the background colour of the header to match the background colour of my logo.

Currently there is a gap of white space left to place a logo in.

I still want to place my logo here but, I do not want the white space in the background.

Is it possible to extend the coloured header background to full width?




Offline abantecart

  • Administrator
  • Hero Member
  • *****
  • Posts: 4358
  • Karma: +298/-10
    • View Profile
    • Ideal Open Source Ecommerce Solution
Re: Making Background Headerstrip Colour Full Width?
« Reply #1 on: December 26, 2013, 07:34:36 AM »
Please post a link to your site.
Please  rate your experience or leave your review
We need your help to build better free open source ecommerce platform for everyone. See how you can help

Offline jimmyjazz

  • Newbie
  • *
  • Posts: 7
  • Karma: +1/-0
    • View Profile
Re: Making Background Headerstrip Colour Full Width?
« Reply #2 on: December 29, 2013, 08:41:31 AM »
The site I am creating is on Xaamp, so I not published the site, so I cannot post a link.

Offline jimmyjazz

  • Newbie
  • *
  • Posts: 7
  • Karma: +1/-0
    • View Profile
Re: Making Background Headerstrip Colour Full Width?
« Reply #3 on: December 29, 2013, 08:53:32 AM »
Image capture below....i want the green bar at the top to be full width.....but still place logo in same place as the template design

Offline abantecart

  • Administrator
  • Hero Member
  • *****
  • Posts: 4358
  • Karma: +298/-10
    • View Profile
    • Ideal Open Source Ecommerce Solution
Re: Making Background Headerstrip Colour Full Width?
« Reply #4 on: December 30, 2013, 10:32:54 PM »
Open stylesheet files for edit: storefront/view/default_html5/stylesheet/style.css

Locate:
Quote
.logo {
   width: 300px;
   background-color: #fff;
   text-align: center;
   height: 72px;
   line-height: 72px
}

Remove: background-color: #fff;
Please  rate your experience or leave your review
We need your help to build better free open source ecommerce platform for everyone. See how you can help

Offline jimmyjazz

  • Newbie
  • *
  • Posts: 7
  • Karma: +1/-0
    • View Profile
Re: Making Background Headerstrip Colour Full Width?
« Reply #5 on: December 31, 2013, 11:26:17 PM »
Aaaahhhh yessss perfect  :)

It worked a treat, thanks for your excellent assistance  :D

Offline moebius

  • Newbie
  • *
  • Posts: 30
  • Karma: +3/-0
    • View Profile
Re: Making Background Headerstrip Colour Full Width?
« Reply #6 on: October 07, 2015, 01:50:25 PM »
For 1.2.4, removing this line will jack up the formatting terribly!
Alternate suggestion:  change the #fff to the color of your background bar (in my case 6633cc) - and it works beautifully.

 

Powered by SMFPacks Social Login Mod