Space under the card image appeared on IE browser

IE fix the height card image

Comments

mohammad faqeh created an issue. See original summary.

mohammad faqeh’s picture

Status: Active » Needs work
mohammad faqeh’s picture

Status: Needs work » Needs review
StatusFileSize
new2.65 KB
rajab natshah’s picture

Thank you Faqeh for reporting

We will need to maintain the standard look as in with radius
https://getbootstrap.com/docs/4.1/components/card/
If we do not want the radius in our custom theme for a project we could change @card-border-radius:

We had back-ported Card from bootstrap4 to LESS to have it work in Bootstrap3
https://github.com/twbs/bootstrap/blob/v4.1.3/scss/_card.scss

// Card bootstrap3 back-ported from bootstrap4.
@card-spacer-y:                     0.75rem;
@card-spacer-x:                     1.25rem;
@card-border-width:                 1px;
@card-border-radius:                @border-radius-base;
@card-border-color:                 rgba(red(@gray-base), green(@gray-base), blue(@gray-base), 0.125);
@card-inner-border-radius:          calc(@card-border-radius - @card-border-width);
@card-cap-bg:                       rgba(red(@gray-base), green(@gray-base), blue(@gray-base), 0.03);
@card-bg:                           #fff;

@card-img-overlay-padding:          1.25rem;

@card-group-margin:                 floor(@grid-gutter-width/2);
@card-deck-margin:                  @card-group-margin;

@card-columns-count:                3;
@card-columns-gap:                  1.25rem;
@card-columns-margin:               @card-spacer-y;

in Vartheme
https://github.com/Vardot/vartheme/blob/8.x-6.x/less/variables.less
https://github.com/Vardot/vartheme/blob/8.x-6.x/less/component/card.comp...

And in VARTHEME_SUBTHEME
https://github.com/Vardot/vartheme/blob/8.x-6.x/VARTHEME_SUBTHEME/less/v...
https://github.com/Vardot/vartheme/blob/8.x-6.x/VARTHEME_SUBTHEME/less/c...

I do think that we could have a look at the latest work on Bootstrap 4.1.3
https://github.com/twbs/bootstrap/blob/v4.1.3/dist/css/bootstrap.css#L4371

To make sure that we are supporting IE I think IE11

mohammad faqeh’s picture

StatusFileSize
new1.28 KB
rajab natshah’s picture

Title: IE fix the height card image » [IE] fix the height space under the card image appeared on IE browser
Issue summary: View changes
rajab natshah’s picture

Version: 8.x-5.2 » 8.x-6.x-dev
rajab natshah’s picture

Assigned: mohammad faqeh » Unassigned
Priority: Major » Normal
rajab natshah’s picture

StatusFileSize
new1.95 KB

rajab natshah’s picture

Assigned: Unassigned » mohammed j. razem
rajab natshah’s picture

Assigned: mohammed j. razem » Unassigned
rajab natshah’s picture

Status: Needs review » Fixed

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.

mohammad-fayoumi’s picture

StatusFileSize
new1.7 KB

Remove gitignore file from Vartheme.