Alignment Issues, and Padding Issues on Narative

Highlighted
Shopify Partner
10 1 0

You can learn how CSS works.
With that, and modifying the correct files of your theme you should be good.

0 Likes
Highlighted
Shopify Partner
10 1 0

Sorry for having expressed myself that way, it lead to confusion.

All .card__info instances of the DOM should be the same height.

And all .card__image-wrapper instances of the DOM should be the same height.

Before that, both instances of the classes in the DOM should be displayed as inline-block or block, and have a relative position.

It would be great if both instances of the classes have a hidden overflow.

0 Likes
Highlighted
Shopify Partner
10 1 0

Moreover, when you don't have a fixed font size of 0 for all your html elements that happen to order content in the layout, the best you can do is to change the way you construct your environment to order things with nested ul and li elements that have defined floats and are displayed as inline blocks.

0 Likes
Highlighted
Shopify Partner
3192 702 848

@comingera 

Please add the following code at the bottom of your assets/theme.scss.liquid file.

.card__info {
    padding: 8px 0 !important;
}
.grid {
margin: 0px !important;
}

 

Hope this helps.

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
Highlighted
Shopify Partner
1151 232 299

Add this css

.template-collection .card__availability {
    font-size: 15px !important;
}

.template-collection .page-width{
   padding: 6px !important;
}
.template-collection .grid{
 margin: -4px !important;
      margin-left: 0 !important;
}
Want to modify or custom changes on store hire me.
My Email: guleriathakur43@gmail.com
Skype: navrocks1
If helpful then please Like and Accept Solution.
If you are happy and want to donate small Click here (Its my paypal)
Highlighted
Tourist
80 0 0

A mixture or your code and @Guleria's code resulted in good changed however didn't completely resolve the issues. I tried both of your codes separately as well as fine tuning them but the far right side's padding was always a little bit smaller then the far left side's. alignment is mostly fixed but a new alignment issue has appeared. Sorry to be bother but I really appreciate your guy's help and I really want to solve this!

 

Screen Shot 2020-10-20 at 8.37.49 AM.png

 

 

 

 

 

 

 

 

Best Regards,

 

Coming Era

0 Likes
Highlighted
Tourist
80 0 0

Here is the code that got this effect

 

.template-collection .card__availability {
    font-size: 15px !important;
}
.card__info {
    padding: 5px 0 !important;
}

 

again still faced with a few problems

 

Screen Shot 2020-10-20 at 8.37.49 AM.png 

 

 

 

 

 

 

 

 Hope You guys can help me! Thank you SO much for already helping me it means so much! Still a few problems that I hope we can resolve

@Guleria @dmwwebartisan @Superfunk @Defineify (tagging you guys so you can see!)

0 Likes