Button Editing
Accordion
Accordion Code
<div class="accordion" id="accordionSet"><!-- START ONE -->
<div class="card">
<div class="card-header" id="headingOne">
<p class="mb-0"><a aria-controls="collapseOne" aria-expanded="true" data-target="#collapseOne" data-toggle="collapse">ONE LINK</a></p>
</div>
<div aria-labelledby="headingOne" class="collapse" data-parent="#accordionSet" id="collapseOne">
<div class="card-body">
<p>ONE CONTENT</p>
</div>
</div>
</div>
<!-- CLOSE ONE --> <!-- START TWO -->
<div class="card">
<div class="card-header" id="headingTwo">
<p class="mb-0"><a aria-controls="collapseTwo" aria-expanded="true" data-target="#collapseTwo" data-toggle="collapse">TWO LINK</a></p>
</div>
<div aria-labelledby="headingTwo" class="collapse" data-parent="#accordionSet" id="collapseTwo">
<div class="card-body">
<p>TWO CONTENT</p>
</div>
</div>
</div>
<!-- CLOSE TWO --> <!-- START THREE -->
<div class="card">
<div class="card-header" id="headingThree">
<p class="mb-0"><a aria-controls="collapseThree" aria-expanded="true" data-target="#collapseThree" data-toggle="collapse">THREE LINK</a></p>
</div>
<div aria-labelledby="headingThree" class="collapse" data-parent="#accordionSet" id="collapseThree">
<div class="card-body">
<p>THREE CONTENT</p>
</div>
</div>
</div>
<!-- CLOSE THREE --></div>
<!-- CLOSE ACCORDIAN -->
Sample Tabbed Navigation
This is the content for Tab 1 his is the content for Tab 1 his is the content for Tab 1 his is the content for Tab 1 his is the content for Tab 1 his is the content for Tab 1 his is the content for Tab 1 his is the content for Tab 1 his is the content for Tab 1 his is the content for Tab 1 his is the content for Tab 1
Words for this one words for this one words for this one words for this one words for this one words for this one words for this one words for this one words for this one words for this one words for this one words for this one words for this one words for this one
111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333 111 222 333
Code for tabbed navs
remove the spaces in the tags
THIS IS THE NAV TABS SECTION
< ul class="nav nav-tabs" id="myTab" role="tablist" >
< li class="nav-item">< a aria-controls="home" aria-selected="true" class="nav-link active" data-toggle="tab" href="#home" id="home-tab" role="tab">Home< /a>< /li>
< li class="nav-item">< a aria-controls="profile" aria-selected="false" class="nav-link" data-toggle="tab" href="#profile" id="profile-tab" role="tab">Profile< /a>< /li>
< li class="nav-item">< a aria-controls="contact" aria-selected="false" class="nav-link" data-toggle="tab" href="#contact" id="contact-tab" role="tab">Contact< /a>< /li>
< /ul>
THIS IS THE CONTENT SECTION
< div class="tab-content" id="myTabContent">
< div aria-labelledby="home-tab" class="tab-pane fade show active" id="home" role="tabpanel">this is tab 1< /div>
< div aria-labelledby="profile-tab" class="tab-pane fade" id="profile" role="tabpanel">this is tab 2< /div>
< div aria-labelledby="contact-tab" class="tab-pane fade" id="contact" role="tabpanel">this is tab 3< /div>
</div >
Buttons / Anchor links
These two "primary|secondary" are the two anchor / button classes to use for most buttons / links
< a class="btn btn-primary" href="#">Primary< /a>
< a class="btn btn-secondary" href="#">Secondary< /a>