-
Posts
-
Okay, I am not really sure why this has been giving me so much trouble, but I have been working on this one image the same amount of time as it has taken me to make this entire site.
It’s a very simple setup, a grid row with 1/2 + 1/2. The left 1/2 should have a background image that is fixed, so only the right side has scrolling content. For some reason, when setting the image as fixed within the grid row element, specifically for the first grid row, it either does not fill the entire space, or if it does it is way too large.
This should be as simple as setting a background image for a color section as fixed, you never really see white background. But for some reason with this grid row section I am always seeing white cut off areas when checking the responsiveness, and the image is a square so it should easily crop, there should never be any white space.
Does the background fixed position rely on the images resolution?
Thanks
Hey haydaw,
can you provide us a screenshot showing the issue please? use imgur.com or dropbox. On which devices have you got problems? If it is on iPad portrait mode then try to use this code inside Quick CSS field:
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) { .flex_cell.no_margin.av_one_half.avia-builder-el-1.el_before_av_cell_one_half.avia-builder-el-first.avia-full-contain.av-zero-padding { background-size: 100% 100% !important; background-position: -119px 0px !important; }}and play around with different values until you find something you like.
For more information about media queries: https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
Best regards,
Andy
- You must be logged in to reply to this topic.