Solved

Debut: Vertically align custom content

stellaa
Excursionist
43 0 11

Hello!

I am trying to fix the vertical alignment of the left portion of this custom content section on the website home page. I have a reference photo of the desired effect below. 

 

The left side is custom content at 50%, where I include text and a button. I want this to be centered in the middle, not aligned to the top.The left side is custom content at 50%, where I include text and a button. I want this to be centered in the middle, not aligned to the top.

 

Intended result (used the text option instead of custom HTML)Intended result (used the text option instead of custom HTML)

 

Would really appreciate any help!! 

 

Website Link: https://emildific.com/

Password to enter is emildific

Accepted Solution (1)

AvidBrio
Shopify Expert
295 17 29

This is an accepted solution.

@stellaa  you can add CSS  inside the assets/theme.css

/*custom__item custom__item--html custom__item--25b866bd-e009-40e2-8c30-7d6d0ac65535 small--one-half medium-up--one-half

*/

.custom__item--25b866bd-e009-40e2-8c30-7d6d0ac65535 {    vertical-align: middle;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

 
output : emildific.com Screenshot from 2020-11-04 11-55-17.png

 



If you find our comment helpful, hit the like button and accept it as a solution.
Want us to implement custom changes in your store? Contact us
Email me directly - jim@avidbrio.com

View solution in original post

Replies 5 (5)

AvidBrio
Shopify Expert
295 17 29

This is an accepted solution.

@stellaa  you can add CSS  inside the assets/theme.css

/*custom__item custom__item--html custom__item--25b866bd-e009-40e2-8c30-7d6d0ac65535 small--one-half medium-up--one-half

*/

.custom__item--25b866bd-e009-40e2-8c30-7d6d0ac65535 {    vertical-align: middle;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

 
output : emildific.com Screenshot from 2020-11-04 11-55-17.png

 



If you find our comment helpful, hit the like button and accept it as a solution.
Want us to implement custom changes in your store? Contact us
Email me directly - jim@avidbrio.com
stellaa
Excursionist
43 0 11

it works! you're a star! thank you

Alfons_Turtle
Visitor
2 0 0

Hi, I've got the same problem. How to find out the right item ID?

Where does this come from?-> 25b866bd-e009-40e2-8c30-7d6d0ac65535

 

jotvark
Shopify Partner
65 11 30

@Alfons_Turtle 

Please see the screenshot how to find id.

id-find.png

Need help with theme customization or add a new feature? Hire me
Email: jotvark@gmail.com | Skype: jotvark3919

If helpful then please Like and Accept as Solution
Alfons_Turtle
Visitor
2 0 0

Hi jotvark,

thank you for answering! I still found it on emildific, but I mean how to find in my own store, so that I can use it on my own :).

I didn't find something like this in the quellcode.