Accordian troubleshooting
I'm using v3 of the html templates and sometimes when I insert a single accordian, the bottom line of the text box disappears when the accordian is collapsed. And then on other pages, the text box is visable. I'm inserting the accordian below a horizontal line and right above the page footer on all pages.
Any ideas why this is occurring?
Answers
-
Could you share a screenshot and the HTML?
-
Here's the html for that page:
<!DOCTYPE html><html lang="en"><head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <!-- Bootstrap CSS --><link rel="stylesheet" href="/content/HDEC/HDECCOMMONINTERFACETEMPLATE/01 - Common Course Syllabus/../10%20-%20HTML%20Templates/_assets/thirdpartylib/bootstrap-4.3.1/css/bootstrap.min.css">
<!-- Font Awesome CSS -->
<link rel="stylesheet" href="/content/HDEC/HDECCOMMONINTERFACETEMPLATE/01 - Common Course Syllabus/../10%20-%20HTML%20Templates/_assets/thirdpartylib/fontawesome-free-5.9.0-web/css/all.min.css">
<!-- Template CSS -->
<link rel="stylesheet" href="/content/HDEC/HDECCOMMONINTERFACETEMPLATE/01 - Common Course Syllabus/../10%20-%20HTML%20Templates/_assets/css/styles.min.css">
<link rel="stylesheet" href="/content/HDEC/HDECCOMMONINTERFACETEMPLATE/01 - Common Course Syllabus/../10%20-%20HTML%20Templates/_assets/css/custom.css">
<title>Blank Page</title>
</head><body><div class="container-fluid">
<div class="row">
<div class="col-12 banner-img">
<p><img src="/content/HDEC/HDECCOMMONINTERFACETEMPLATE/01 - Common Course Syllabus/../10%20-%20HTML%20Templates/_assets/img/banner_03.jpg" alt="banner"></p>
</div>
<div class="col-sm-10 offset-sm-1">
<h1>NLC Education & Behaviour Policies</h1>
<p>The following policies contain important information for you to know and understand as a student at Northern Lights College:</p>
<p style="padding-left: 40px;"><a href="https://www.nlc.bc.ca/Portals/0/documents/Policies/E-1_02.pdf" target="_blank" rel="noopener">Academic Monitoring</a><a href="https://www.nlc.bc.ca/Portals/0/documents/Policies/A-3_09.pdf" target="_blank" rel="noopener">Information Technology Acceptable Use</a><a href="https://www.nlc.bc.ca/Portals/0/documents/Policies/A-5_18.pdf" target="_blank" rel="noopener">Sexual Violence and Misconduct</a><a href="https://www.nlc.bc.ca/Portals/0/documents/Policies/A-5_15.pdf?ver=2017-10-18-102350-243" target="_blank" rel="noopener">Student Discrimination, Bullying and Harassment Prevention</a><a href="https://www.nlc.bc.ca/Portals/0/documents/Policies/A-5_04.pdf?ver=2017-10-18-101907-553" target="_blank" rel="noopener">Student Non-Academic Code of Conduct</a><a href="https://www.nlc.bc.ca/Portals/0/documents/Policies/E-4_05.pdf" target="_blank" rel="noopener">Student Rights and Responsibilities</a></p>
<p>Please also review the NLC <a href="https://https://www.nlc.bc.ca/Current-Students/Conduct-and-Policies" title="Conduct and Policies">Conduct and Policies</a> web page.</p>
<hr>
<p class="small"></p>
<p><!-- Accordion headings should be changed to respect page hierarchy --></p>
<div class="accordion">
<div class="card">
<div class="card-header">
<h2 class="card-title"><span style="font-size: 14px;">Attributions</span></h2>
</div>
<div class="collapse">
<div class="card-body">
<p><span style="font-size: 14px;">None for this page</span></p>
</div>
</div>
</div>
</div>
<p class="small"></p>
</div>
<div class="col-12"><footer>
<p><img src="/content/HDEC/HDECCOMMONINTERFACETEMPLATE/01 - Common Course Syllabus/../10%20-%20HTML%20Templates/00_NLC%20pages/logo_horiz_black-small.jpg" alt="NLC logo"></p>
</footer></div>
</div> -
@Shari.H.931 Looks like there might be an issue with the end of your code. There should be two closing divs after the footer div instead of just one, and then the closing body and html tags too. So try adding this to the end:
</div>
</body>
</html>
