Adding an element at the right of another element (instead below)

Hi! With HTML I’d use the tag span to achieve it. But in the following case we have a pricing table: is there any way to surround the pricing and the text sections with span tags? If so, that would be a solution?

I think you’ll understand the issue better with the following image:

How to achieve that? Actually, the pricing table expands to the full width (which is specially ugly for me). You can see here: https://www.edinventa.com/en/buy-heromask/

Thank you one more time, you are awesome!! :slight_smile: :slight_smile: :slight_smile:

Carlos

Hi @educainventions,

Thanks for writing in.

As I checked your setup, I could see that even though you set email notify div beside the complete pack, it will overlap the texts.

I suggest instead of sticking it together, activate the one column earlier so that it will not look bad. To do it, add this code below:

@media (max-width: 979px)
.x-column.x-sm {
    float: none;
    width: 100%;
    margin-right: 0;
} 

@media (max-width: 979px)
.x-pricing-table[class*="-column"] .x-pricing-column {
    width: 100%;
}

Hope it helps.

Let us know how it goes.

Thanks.

Hi. I have added your code, but I don’t see any change at all. I don’t understand your explanation either, so maybe I’m not doing what you are asking (I expected to understand after using the css code and seeing the result). So here is where I pasted your code:

Hey @educainventions,

If you want that part to be 2 columns, the solution would be to use Global Blocks. Create a global block and add in your pricing table and text section in each column in a 2 column setup. Then, in your page, add the global block using the Global Block element in that area.

Other solutions would require the use of custom HTML and CSS which would fall under custom development which is outside the scope of our support.

Thanks.

The blocks solution worked perfectly. Great!!! :slight_smile:

Thank you one more time :slight_smile:

Carlos

You are most welcome. :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.