Topic: Reverse cascade does not work properly

Tabian free asked 6 years ago


The reverse cascade card is not working properly. I copied the code right from the example here: example. Here is the code:
	<!-- Card -->
<div class="card card-cascade reverse">

  <!-- Card image -->
  <div class="view view-cascade overlay">
    <img class="card-img-top" src="https://mdbootstrap.com/img/Photos/Slides/img%20(70).jpg" alt="Card image cap">
    <a href="#!">
      <div class="mask rgba-white-slight"></div>
    </a>
  </div>

<!-- <div class="d-flex flex-row flex-wrap justify-content-center" style="width: 600px;"> -->
  <!-- Card content -->
  <div class="card-body card-body-cascade text-center">

    <!-- Title -->
    <h4 class="card-title"><strong>My adventure</strong></h4>
    <!-- Subtitle -->
    <h6 class="font-weight-bold indigo-text py-2">Photography</h6>
    <!-- Text -->
    <p class="card-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Exercitationem perspiciatis voluptatum a, quo nobis, non commodi quia repellendus sequi nulla voluptatem dicta reprehenderit, placeat laborum ut beatae ullam suscipit veniam.
    </p>

    <!-- Linkedin -->
    <a class="px-2 fa-lg li-ic"><i class="fa fa-linkedin"></i></a>
    <!-- Twitter -->
    <a class="px-2 fa-lg tw-ic"><i class="fa fa-twitter"></i></a>
    <!-- Dribbble -->
    <a class="px-2 fa-lg fb-ic"><i class="fa fa-facebook"></i></a>

  </div>

</div>
<!-- Card -->
I have the pro version of JQuery. See screen shot for details. screen shot

Piotr Glejzer staff answered 6 years ago


Hi, Yes, your code is broken because you don't have a class 'wider' next to class 'card-cascade'.  In an example, it exists and I used and this is working. Check this out : Example with class wider Best, Piotr

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.5.10
  • Device: SublimeText3
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: Yes
Tags