need top vertical alignment in columns (cardinal)

[lbdesign]

When I have more than one column, and I put an image in one column, if the adjacent columns are longer than the image, then the image floats vertically in the middle of its column. It does not align at the top of the column as I would expect. This is causing me problems on some pages that I don’t want to have to “cheat” around.

I tried giving the image and the enclosing column a custom class of .floattop and used this CSS, but it didn’t do anything:

<code

>.floattop {
position: relative;
top: 0px;
}

On the linked page, you can see the man’s portrait floating vertically. How do I make images foot to the top of their enclosing object?

thanks

[Mohammad – SUPPORT]

Hi,

Do you want to first image below of first image? Am i right?

Thanks 🙂
With Best Regards
Mohammad

[lbdesign]

I’m sorry, I don’t understand your question. I want to be able to make items in columns to align to the top of columns. Does that make sense?

[Mohammad – SUPPORT]

Hi,

Please attach your screenshot to get your issue exactly.

Thanks 🙂
With Best Regards
Mohammad

[lbdesign]

I want the indicated image to float to the top of the enclosing column. How do we achieve this?

Prologue

 

 

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,

Please use this custom css code:-

.page-id-13028 div.spb-column-container.col-sm-4.floattop div.spb-asset-content{

margin-top:10px !important;

}

-Mohammad

[lbdesign]

Thank you, that works! But only when I leave in my custom code as well, which targets a custom class attached to these objects. When I remove my custom tag, it does not work.

With this code you provided, you are targeting only that column on that one page, in combination with my code —but this is a site-wide issue for me. How do I target any column I want? Can I use only the custom CSS class field within the page builder so that I can add this to any object? How would you write that code and selector?

[Mohammad – SUPPORT]

Hi,

Please remove last css code and use this css code to remove the issue side-wide.

.floattop div.spb-asset-content{

margin-top:10px !important;

}

-Mohammad

[lbdesign]

Thank you.

[Mohammad – SUPPORT]

Hi,
You most welcome. I’m glad that issue resolved.
Thanks 🙂
With Best Regards
Mohammad