Alignment issues Classic Headline and new Button Elements

[managet0p_xtheme]

Hello,
this should be an easy fix, but I have been trying to solve alignment issues for a header and button for ages and not making any progress.

I am using the Classic Custom Headline (ID added for Anchor) & the new Button elements in 1 row and 1 column.

Both elements need be displayed side by side, as marked in red:

However, in the Cornerstone preview and online the button is displayed underneath the Headline.
http://managetopia.apps-1and1.net/

I tried splitting the row into 2 columns, but the display on a small screen (desktop: < 767px) looks worse - Headline right, button left - see link listed above, section with Headline “Business Cases”!

I know a container would solve the problem, but I need to use the new button element because of the customization used on that page.

Do you have a CSS fix for the nowrap/break problem?

Many thanks for your help

[basanta]

Hi There,

Thanks for writing in!

Please add the following css to your custom css.

h2#portfolio {
     display: initial;
    vertical-align: middle;
}

let us know how it goes.

THanks

[managet0p_xtheme]

@basanta,
Many thanks for your reply.
it works perfect for Chrome and for Firefox, I will need to make a few minor tweaks, but there is an issue with IE 11.
The alignment doesn’t appear to be working. Is there an additional code for IE 11?

Many thanks again for your assistance

[basanta]

Hi There,

Can you please replace this css with the old one that I had sent.

h2#portfolio {
    display: inline-block;
    vertical-align: middle;
    margin: 0px 50px 0px 0px;
}

Let us know how it goes.

Thanks

[managet0p_xtheme]

@basanta,
Brilliant, thanks for the new CSS, that fixes the problem for IE
In Firefox the alignment of the button doesn’t appear to be “middle”, but rather aligned “top”. It’s ok for now.
Sincere thanks for all your help.

[XSupport]

Glad we could help Feel free to ask if you face any further issues.

Best regards.