Slogan elements in Agile

[zoodc]

Hi,

When viewing this page on a large monitor, the slogan image scales up, but looks terrible. When reducing the browser window size to less than 1100 pix wide, it looks good.

http://bwc.dklcheng.com/communicator/features/

Is there anyway to change how the cover image scales?

[Ernesto]

@media only screen
and (min-width : 1224px) {
#home2-heading {width: auto
height: auto}
}

Cheers!

[zoodc]

Hi Ernesto, this didn’t work for me.

The problems seems to be the attachment and position for the background that’s being introduced somewhere. Here’s the DIV:

<div id=”home2-heading” data-parallax-speed=”0.5″ class=”segment clearfix parallax-background parallax-banner” style=”background-image: url(http://bwc.dklcheng.com/wp-content/images/bwcommunicator.jpg); background-attachment: fixed; background-position: 50% 41px; “>

when I turn off the elemental attributes, it seems ok, but I don’t know where the code is being introduced and I can’t override it from the stylesheet: background-attachment: fixed; background-position: 50% 41px;

[Ernesto]

Hi! Try out disabling all of your plugins to see if one of them is causing the wrong scaling of the images. Let us know if this worked out for you!

Cheers!

[zoodc]

Turning off plug-ins had no effect.

[Ernesto]

Hi!Try out using the following CSS code: to adjust background size.

#home2-heading {background-size: 100% !important;}

Cheers!

[zoodc]

Works now. Thanks! I put the background-size: 100% !important; override into the short code arguement

[Ernesto]

Great to here that worked out!!

Cheers!

[Author]

Posts