Jump to content
sodypop

[SOLVED] Block Banner with full width

Recommended Posts

I want the block banner to stretch across the entire page.

 

I went to this file and changed the portion under mas-width but nothing changed.

 

/themes/default-bootstrap/css/modules/blockbanner/blockbanner.css

 

#header .banner a img {
  display: block;
  width: 100%;
  height: 100%;
  max-height: 65px;         
  max-width: 1170px; }    <----- CHANGED THIS

 

What else can I do?

 

http://www.sweetsodypop.com

 

Share this post


Link to post
Share on other sites

at the moment it looks like:
lEEgWdA.png

so it works 

 

clear browser cache or refresh page with ctrl+f5 (refresh with cleaning cache)

Share this post


Link to post
Share on other sites

Clearing cache and reloading page with f5 didn't change anything.  I want the gray to stretch all the way across the page so there isn't any black showing.

Share this post


Link to post
Share on other sites

now i understand.

your image size is 1170 width

how you want to increase with of this image for example, for screens with resolution 2400x1780 ?

Share this post


Link to post
Share on other sites

I actually changed the width to 1900 to see if that would be large enough and the width didn't change.  It seems like the overall width of the template needs to change?  Just wondering if I do that if the entire store will be wider and how I can prevent that from happening?

Share this post


Link to post
Share on other sites

use this:

.banner .container, header .banner a {max-width:100%!important; width:100%!important;}

in your global.css file

  • Like 3

Share this post


Link to post
Share on other sites

Do I just place that randomly in the global.css file?   It didn't seem to work.

Share this post


Link to post
Share on other sites

yess, it's enough to paste it randomly, the best position in my opinion: at the end of the file

i marked topic as solved

with regards,

milos

Share this post


Link to post
Share on other sites

use this:

.banner .container, header .banner a {max-width:100%!important; width:100%!important;}

in your global.css file

I did it and banner filled in space only on the left side, right side has still a square of the black background..

Share this post


Link to post
Share on other sites

use this:

.banner .container, header .banner a {max-width:100%!important; width:100%!important;}

in your global.css file

Can you tell me how I can do it in the height, My banner need to a bigger size in the height and I try to change in a lot of places but do not change the size in my site, I seach in all forum and this is the topic more close to answer that I need.

 

Sorry for my English.

Share this post


Link to post
Share on other sites

hello

 

.banner .container, header .banner a {max-width:100%!important; width:100%!important;}

 
i used that code and past to global.css, but its fitted to left side but have black color at the right side   http://c2n.me/3cQsfvg.jpg
Edited by ps3z (see edit history)

Share this post


Link to post
Share on other sites

i solved like this

 

 

 

#header .banner a img {
  display: block;
  width: 100%;
  height: 100%;
  max-height: 92px;         
  max-width: 1900px; }
 

.banner .container, header .banner a {max-width:100%!important; width:100%!important;} 

Edited by ps3z (see edit history)

Share this post


Link to post
Share on other sites

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More