Glossary
No edit summary
No edit summary
Tag: 2017 source edit
Line 1: Line 1:
<div style="display: flex; flex-wrap: wrap; max-width: 1200px; width: 100%; padding-left: 5%; margin-bottom:20px;">
 
     <div style="flex: 0 0 172px; max-width: 172px; min-height: 40px; display: flex; align-items: center; align-self: start; padding-left: 10px; text-align: left; color: black; font-size: 1.25rem; font-family: Outfit, sans-serif; font-weight: 500; word-wrap: break-word; background: #E3E8EE;">
<style>
        <!--{$heading|default:'Default Heading'}-->
.glossary-item {
    </div>
    box-sizing: border-box;
    <div style="flex: 0 0 20px; max-width: 20px;">  
    width: 48%;
        <!-- Hidden spacer -->
    border: 1px solid #000;
    </div>
    padding: 20px;
    <div style="flex-grow: 1; flex-basis: calc(100% - 192px); display: flex; align-items: center; padding-left: 10px; color: black; font-size: 1.25rem; font-family: Outfit, sans-serif; font-weight: 500; word-wrap: break-word; background: #E3E8EE;">
    margin-bottom: 20px;
        <!--{$description|default:'Default Description'}-->
  }
    </div>
  .glossary-title {
</div>
     font-weight: bold;
  }
  .glossary-content {
    margin-top: 10px;
  }
  .read-more {
    display: block;
    margin-top: 10px;
    text-align: right;
    text-decoration: none;
    color: #000;
  }
  /* Style to handle the spacing when clicked on navigation */
  :target {
    padding-top: 50px;
    margin-top: -50px;
    display: block;
  }
</style>
<div class="glossary-item">
  <div class="glossary-title">Heading</div>
  <div style="border-bottom: 1px solid black; margin: 0 -15px;"></div>
  <div class="glossary-content">description</div>
  <div style="border-bottom: 1px solid black; margin: 0 -15px;"></div>
  <a href="#" class="read-more">Read more ></a>
</div>

Revision as of 08:20, 25 April 2024

<style> .glossary-item {

   box-sizing: border-box;
   width: 48%;
   border: 1px solid #000;
   padding: 20px;
   margin-bottom: 20px;
 }
 .glossary-title {
   font-weight: bold;
 }
 .glossary-content {
   margin-top: 10px;
 }
 .read-more {
   display: block;
   margin-top: 10px;
   text-align: right;
   text-decoration: none;
   color: #000;
 }
 /* Style to handle the spacing when clicked on navigation */
 :target {
   padding-top: 50px;
   margin-top: -50px;
   display: block;
 }

</style>

Heading
description
 <a href="#" class="read-more">Read more ></a>
This page was edited 4 days ago on 05/16/2024. What links here