[PW-17.7v2/ret] Fix place/img's "collapsing"

Excluding full space "collapsing" in the absence of "src".

core: B-2 / WL-BL

Author: matowdev

core-courses/2-web-layout-basic-level/17_Grids/17_7_Practical_Work_17_Grids_v2/css/courses.css

@@ -24,26 +24,40 @@
   margin-bottom: 30px;
 }
 
+.courses__card-wrap .card {
+  border-radius: 0;
+}
+
 .courses__card {
   position: relative;
   border-radius: var(--main-radius);
   min-height: 653px;
   overflow: hidden;
 }
 
+.courses__card picture {
+  display: block;
+  border-top-left-radius: var(--main-radius);
+  border-top-right-radius: var(--main-radius);
+  text-align: center;
+  color: var(--white);
+  background-color: var(--plum);
+}
+
 .courses__card_offset {
   margin-bottom: 1px;
 }
 
 .courses__card-image {
-  text-align: center;
+  display: block;
+  height: 100%;
   object-fit: contain;
 }
 
 .courses__card-info {
   position: absolute;
-  top: 10px;
-  right: 10px;
+  top: 15px;
+  right: 20px;
   display: inline-block;
   padding-left: 29px;
   color: var(--white);
@@ -105,6 +119,12 @@
 
 /* media queries */
 
+@media (max-width: 320px) {
+  .courses__card-wrap .card {
+    border-radius: 25px;
+  }
+}
+
 @media (min-width: 576px) {
   .courses {
     padding-top: 74px;
@@ -121,8 +141,6 @@
   }
 
   .courses__card-info {
-    top: 10.5px;
-    right: 11px;
     padding-left: 28px;
   }
 
@@ -233,10 +251,6 @@
     min-height: 479px;
   }
 
-  .courses__card-info {
-    right: 5.5px;
-  }
-
   .courses__card-content {
     padding-bottom: 30.5px;
     padding-left: 29px;

core-courses/2-web-layout-basic-level/17_Grids/17_7_Practical_Work_17_Grids_v2/css/teachers.css

@@ -45,8 +45,16 @@
   overflow: hidden;
 }
 
-.teachers__card-image {
+.teachers__card picture {
+  display: block;
   text-align: center;
+  color: var(--white);
+  background-color: var(--plum);
+}
+
+.teachers__card-image {
+  display: block;
+  height: 100%;
   object-fit: contain;
   box-shadow: 0 1px 10px var(--specific-gray);
 }