Solved

Text align custom css

1F
Excursionist
21 1 1

Dear community,

 

I created a custom css to align on the right the BOLD text only. 

I have an issue, it works but the text is not on the same line than the text on the left. There is a line break...

By the way, all those custom css code slow down my website... what can i do ?

 

Can you please help me? Below is my custom css:

 

h3,
h4 {
text-align: left;
}
h4 {
border-bottom: 0.5px solid #999;
padding-bottom: 7px;
font-size: 14px;
}
h3 {
font-size: 22px;
}
h4 strong,
h4 b {
text-align: right !important;
display: block;
}

 

Capture d’écran 2024-02-07 à 10.55.30.png

 

Thank you guys !

Accepted Solution (1)
1F
Excursionist
21 1 1

This is an accepted solution.

Many thanks dear,

 

I've just fix it this morning and forgot to mark it as accepted solution.

 

Here is the code:

 

.animate-arrow {
font-size: 15px;
padding: 10px 45px;
background-color: #000000;
border-radius: 30px;
color: #ffffff;
}
h3,
h4 {
text-align: left;
}
h4 {
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 0.5px solid #999;
padding-bottom: 7px;
font-size: 14px;
}
h3 {
font-size: 22px;
}
.multicolumn-card__image-wrapper .media:hover {
transform: scale(1);
}

 

Thank you!

View solution in original post

Replies 2 (2)

ThePixelEdge
Shopify Partner
160 16 15

Hello @1F 
Kindly provid the url so that we can debug at our level.

If helpful then please Like and Accept Solution .
Buy me A Coffee

Whatsapp :- For Shopify Design Changes | Shopify Custom Coding | Custom Modifications


Connect with Us in Our DMs | teampixeledge@gmail.com
1F
Excursionist
21 1 1

This is an accepted solution.

Many thanks dear,

 

I've just fix it this morning and forgot to mark it as accepted solution.

 

Here is the code:

 

.animate-arrow {
font-size: 15px;
padding: 10px 45px;
background-color: #000000;
border-radius: 30px;
color: #ffffff;
}
h3,
h4 {
text-align: left;
}
h4 {
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 0.5px solid #999;
padding-bottom: 7px;
font-size: 14px;
}
h3 {
font-size: 22px;
}
.multicolumn-card__image-wrapper .media:hover {
transform: scale(1);
}

 

Thank you!