Images and parallax video expanded too big when screen size over 1500px

[fionalu]

Hi there,

I did some digging in the forum but couldn’t find any solution.

As you can see on my site, when the screen size goes over 1500px,

images with “Womens Compression Sports Top” and below another one with calf sleeve,

and parallax video with “CABALLERO HEART RATE MONITOR SERIES” are all expanded way too big.

 

The effect I’m hoping is to show the same area as screen size around 1200px,

and remain images and video width 100% and cover to the edge of the screen.

But I don’t want to increase content’s (text line height) height or padding top/bottom, it’s already adjust to the heights I wanted.

 

FYI, My video size is full HD, image size is 1800 × 600.

I’ve upload screenshots to explain the differences, please take a look for me.

Thanks 🙂

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,

Please provide me specific page url with issue to check.

Thanks

Mohammad

[fionalu]

This reply has been marked as private.

[Mohammad – SUPPORT]

Hi,

Please use this custom css code:-

video{width:100% !important;height:auto !important; }

Thanks

Mohammad

[fionalu]

Hi Mohammad,

Sorry, but the code you provided didn’t work.

I also tried adding

.sf-parallax-video{width:100% !important;height:auto !important; } 

but it didn’t work as well.

And please don’t forget the images below with text “Womens compression sports bra” and “Compression Calf Sleeves” are also too big after screen 1500px.

 

I’ve notice these 3 blocks (1 parallax video and 2 parallax images) are all control by .alt-bg and had

@media only screen and (min-width: 1500px) {
.alt-bg {margin-left:-700px!important; padding-left: 700px; padding-right:700px;}}

But when tempering with these settings (set to 210px/-210px like min-width:1200px did), I couldn’t find the right way to achieve the effect I wanted.

Am I looking the wrong place? Need some help here.

Thanks!

[Mohammad – SUPPORT]

Hi,

I forward this to my colleague. He will assist you shortly.

Thanks 🙂
With Best Regards
Mohammad

[fionalu]

Hi,

Any news?

I’ve changed the image size from 1800 × 600 to 1440 x 544, still no luck.

This is not a size issue, at least we’ve cleared that out.

Need a little help here, thanks!

[Mohammad – SUPPORT]

Hi,

He will assist you when he comes online.

– Mohammad

[Kyle – SUPPORT]

Hi

Can you try using a row asset instead of a parallax asset?

– Kyle

[connexweb]

I am having the same problem. I also tried to use the custom CSS code video{width:100% !important;height:auto !important; } and that did not work.

I cannot use the row asset because then it displays the video controls and does not show full width unless you can show me how to do that. I also want the text to overlay.

http://staging2.connexintl.com/index.php/audio-conferencing?preview=true&preview_id=120&preview_nonce=e5063c7e39

Thanks.

Gail

[Mohammad – SUPPORT]

Hi,
Please try to upload attachment again because its failed to upload.
Thanks
Mohammad

[fionalu]

Hi,

Sorry for the delay. After trying the row asset, I couldn’t get the effect I wanted as well.

You could see it here: http://cbwp.bitnamiapp.com/wordpress/en/

(When scrolling down, the first video below four chart asset is the row asset, the second is the original parallax video asset.)

The problem using row for me:

1. Not full screen, there are padding left and right.

2. Text content is missing, it has lower level in hierarchy in HTML so it was covered by the video. On the other hand, Parallax video asset put the text content above the video in HTML, so the content could display correctly.

Any advise? Is it easier to fix row asset’s problem, or should we go back and fix parallax video’s?

Thanks!

[connexweb]

I tried to make the video smaller to allow to upload but I am unable to. would you still be able to help with my issue please. or could you tell me how you save your video, what parameters you use? Thanks.

[fionalu]

Hi connexweb,

My video resolution is full HD.

You may want to check out how to increase WordPress file upload limit here, or contact your host to increase it.

Also, if your questions are not related to mine, please consider opening a new post for yourself, because new replies will increase the support waiting time for me (they reply the oldest first). Thanks!

[Kyle – SUPPORT]

Will report the row issue to the developer so he can fix for the next update

– Kyle