Display image 50% on X and 0% on Y

[barefootMarc]

I am trying to get an image within a row to display on the bottom of the row, and in the middle of the screen. I have tried many different combinations and can’t seem to get the right fit.

my code

.inner_page_title{
bottom:0;
}

The services with the light purple transparent box should remain in the centre and bottom of the row at all times.

Attachments:

You must be logged in to view attached files.

[barefootMarc]

when the width of the browser window is wide it seems to work. As you shrink the width you start to get padding underneath.

-M

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

.spb_parallax_asset:not(.spb-column-container){
padding:0px !important;
}

Thanks
Mohammad

[barefootMarc]

Hi Mohammad,

It is now dropping the image container below the parallax bottom.

Only when the browser is at 650 px does it display properly. More than that and in drops below, less than that there is padding.

Ive included some screen grabs.

Thank you again for such a timely response. I recommend your themes to everyone because of.

-M

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Hi

Can you please remove all customisation that you have made relating to that area, I know a much simpler way to do it but I need to start from the starting point without your custom css

– Kyle

[barefootMarc]

HI Kyle,

All css has been removed.

-M

[Rui Guerreiro – SUPPORT]

Hi,

I just assigned it to Kyle so he can reply when he comes online.

-Rui

[barefootMarc]

Hey Guys,

Any luck?

[Kyle – SUPPORT]

In the Row asset, set the padding to 0, then add this to your custom css:

.sf-parallax-video .spb_image {
  margin-bottom: 0;
}

– Kyle

[barefootMarc]

Still not working. The video also displays funny on load. After you stretch or shrink the browser window, the BG Video rights itself.

I’ve included an example. Could it be the WEBM video file? Maybe a different codec would work better?

Again, I appreciate all your help.

-M

Attachments:

You must be logged in to view attached files.

[barefootMarc]

So instead of an image I tried making a DIV

<div id=”container_head_main”>
<table width=”100%” height=”675px” border=”0″ align=”center” cellpadding=”0″ cellspacing=”0″>
<tbody>
<tr>
<td style=”text-align: center; color: #FFFFFF;”>Our Process.
</td>
</tr>
</tbody>
</table>
</div>

Still not able to get this bad boy to sit flush on the bottom.

-M

[barefootMarc]

GOT IT WORKING

.spb_parallax_asset:not(.spb-column-container) {
padding-bottom: 0;

}

[Kyle – SUPPORT]

Ok great 🙂