AbanteCart Community

AbanteCart Development => Customization help => Topic started by: jimmyjazz on December 26, 2013, 04:57:17 AM

Title: Making Background Headerstrip Colour Full Width?
Post by: jimmyjazz 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?

Title: Re: Making Background Headerstrip Colour Full Width?
Post by: abantecart on December 26, 2013, 07:34:36 AM

Please post a link to your site.

Title: Re: Making Background Headerstrip Colour Full Width?
Post by: jimmyjazz 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.

Title: Re: Making Background Headerstrip Colour Full Width?
Post by: jimmyjazz 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

Title: Re: Making Background Headerstrip Colour Full Width?
Post by: abantecart 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;

Title: Re: Making Background Headerstrip Colour Full Width?
Post by: jimmyjazz on December 31, 2013, 11:26:17 PM

Aaaahhhh yessss perfect  :)

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

Title: Re: Making Background Headerstrip Colour Full Width?
Post by: moebius 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.