Full-width not working for me

(@garyupham)

I have a few large images that I want to use for full-width slider. I have all of the padding set to 0, the background image set to full-width 100%, but I am still getting inline styling that is making the image small.

<div class="owl-wrapper" style="width: 720px; left: 0px; display: block; transition: all 1000ms ease; transform: translate3d(0px, 0px, 0px);"><div class="owl-item" style="width: 360px;"><div style="padding:0% 0%; margin:0px 0%; min-height:100px; background-image:url(&quot;http://shiftisgood.com/mavin/wp-content/uploads/2017/04/billboard-big-2.jpg&quot;); background-position:left top; background-size:100% auto; background-repeat:no-repeat; background-color:rgb(244, 204, 204); "><figure><img src="/mavin/images/billboard-big-2.jpg"></figure>
</div></div></div>

If that 720px and the 360px are changed to 100%, it shows as I want it to. Can anybody please help me with this?

Viewing 6 replies - 1 through 6 (of 6 total)

Plugin Author simonpedge
(@simonpedge)

9 years, 1 month ago

Hi, You you provide me with the URL of the page where this is occuring, so I could have a look?

Thread Starter Garbonso
(@garyupham)

9 years, 1 month ago

http://shiftisgood.com/mavin/

Plugin Author simonpedge
(@simonpedge)

9 years, 1 month ago

Hi. inspecting that page, I see a couple of JavaScript errors that will affect the page loading, and the Slide Anything JavaScript from executing – see screenshot here:
https://gyazo.com/9e6537be814d5f57e8d6430259ace1f6

Looks like something to do with your site navigation menu…

Thread Starter Garbonso
(@garyupham)

9 years, 1 month ago

Thanks for the help. I couldn’t get that warning on my end for some reason. But, I deactivated every plugin except for slide anything, but am still seeing the issue.

Are you still seeing the error you reported earlier on my end? Sorry I am unable to see this. Are you simply hitting “console” in the inspector to see that? If so, when I click it now, I see no errors.

Plugin Author simonpedge
(@simonpedge)

9 years, 1 month ago

Ok, I’m not seeing that JS error now either.

Within your slider settings try:
– make sure all your ‘Items Displayed’ are set to 1
– uncheck the ‘Allow Shortcodes’ checkbox (sometimes causes issues with page-builders)
– change the CSS #id from ‘sample_slider’ to something else (e.g. ‘slider123’)

If you have no joy with that, then try inserting the following CSS within your ‘style.css’ file:

#sample_slider .owl-wrapper .owl-item {
width:100% !important;
}

Thread Starter Garbonso
(@garyupham)

9 years, 1 month ago

Awesome. Changing all the Items Displayed to 1 did the trick. Thanks Simon!

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Full-width not working for me’ is closed to new replies.