1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

XF 1.4 Where can I include this HTML/CSS code?

Discussion in 'Styling and Customization Questions' started by Betclever, May 14, 2015.

  1. Betclever

    Betclever Active Member

    Hello all,

    I made a page where I put this HTML code:

    HTML:
    <div class="row">
      <div class="large-4 medium-4 columns">
         <ul class="pricing-table active-tb shadow mrgn-20-top">
           <li class="title">Starter</li>
           <li class="bullet-item">512 MB RAM</li>
           <li class="bullet-item">50GB Disk</li>
           <li class="bullet-item">1 User</li>
           <li class="bullet-item">4TB bandwidth</li>
           <li class="price">$9</li>
           <li class="cta-button"><a class="button text-transform" href="#">Choose</a></li>
         </ul>
       </div>
      <div class="large-4 medium-4 columns">
         <ul class="pricing-table active-tb shadow mrgn-20-top">
           <li class="title">Starter</li>
           <li class="bullet-item">512 MB RAM</li>
           <li class="bullet-item">50GB Disk</li>
           <li class="bullet-item">1 User</li>
           <li class="bullet-item">4TB bandwidth</li>
           <li class="price">$9</li>
           <li class="cta-button"><a class="button text-transform" href="#">Choose</a></li>
         </ul>
       </div>
      <div class="large-4 medium-4 columns">
         <ul class="pricing-table active-tb shadow mrgn-20-top">
           <li class="title">Starter</li>
           <li class="bullet-item">512 MB RAM</li>
           <li class="bullet-item">50GB Disk</li>
           <li class="bullet-item">1 User</li>
           <li class="bullet-item">4TB bandwidth</li>
           <li class="price">$9</li>
           <li class="cta-button"><a class="button text-transform" href="#">Choose</a></li>
         </ul>
       </div>
    </div>
    However, when I put this code into the CSS sheet "extra.css", it doesn't work...

    Code:
          body {
      margin: 2rem; }
    
    .active-tb {
      position: relative;
      box-shadow: 0px 2px 10px 0px rgba(50, 50, 50, 0.5);
      transform: scale(1);
      border: 0;
      transition: 0.4s ease;
      z-index: 13; }
      .active-tb:hover {
        position: relative;
        box-shadow: 0px 2px 10px 0px rgba(50, 50, 50, 0.5);
        transform: scale(1.25);
        border: 0;
        z-index: 15; }
    What's wrong please?

    Thanks for your help. :)
     

Share This Page