512
edits
Changes
Jump to navigation
Jump to search
m
Help:Navigation Bar Templates (view source)
Revision as of 11:05, 13 March 2018
, 11:05, 13 March 20181 revision imported: Resources from GCPedia
<html>
<style>
.container{
margin:0 auto;
}
.TemplateBox{
margin:0 auto;
margin-top:40px;
margin-bottom:40px;
width:740px;
font-family: arial, sans-serif;
}
.TemplateName{
background-color:#1C507F;
color:aliceblue;
font-weight:bold;
padding:10px 0px 10px 20px;
font-size:20px;
}
.PreviewTemplate{
background-color:#EAEAEA;
width:100%;
text-align: center;
padding-top:25px;
padding-bottom:25px;
}
.buttons{
margin:0 auto;
text-align:center;
padding-top:10px;
padding-bottom:10px;
background-color:#EAEAEA;
height:60px;
width:740px;
}
.buttons div a{
text-decoration:none;
width:46%;
margin-right:2%;
margin-left:2%;
padding-top:15px;
padding-bottom:15px;
float:left;
text-align:center;
color:#fff;
font-weight:bold;
background-color:#1C1C1C;
font-size:16px;
}
.buttons div a:hover {
background-color:#19486B;
text-decoration:underline;
}
</style>
<div class="container">
<!-- Navigation bar Align Left Start -->
<div class="TemplateBox">
<div class="TemplateName">
Align Left
</div>
<div class="PreviewTemplate">
<img src="http://www.gcpedia.gc.ca/gcwiki/images/5/53/NavigationBar_Template_AlignLeft.png">
</div>
<div class="buttons">
<div>
<a href="http://www.gcpedia.gc.ca/wiki/Help:Navigation_Bar_%E2%80%93_Align_Left_Template" target="_blank">Demo</a>
</div>
<div>
<a href="http://www.gcpedia.gc.ca/gcwiki/index.php?title=Help:Navigation_Bar_%E2%80%93_Align_Left_Template_Source_Code&action=edit" target="_blank">Source Code</a>
</div>
</div>
</div>
<!-- Navigation bar Align Left End -->
<!-- Navigation bar Align Center Start -->
<div class="TemplateBox">
<div class="TemplateName">
Align Center
</div>
<div class="PreviewTemplate">
<img src="http://www.gcpedia.gc.ca/gcwiki/images/d/d9/NavigationBar_Template_AlignCenter.png">
</div>
<div class="buttons">
<div>
<a href="http://www.gcpedia.gc.ca/wiki/Help:Navigation_Bar_%E2%80%93_Align_Center_Template" target="_blank">Demo</a>
</div>
<div>
<a href="http://www.gcpedia.gc.ca/gcwiki/index.php?title=Help:Navigation_Bar_%E2%80%93_Align_Center_Template_Source_Code&action=edit" target="_blank">Source Code</a>
</div>
</div>
</div>
<!-- Navigation bar Align Center End -->
<!-- Navigation bar Align Right Start -->
<div class="TemplateBox">
<div class="TemplateName">
Align Right
</div>
<div class="PreviewTemplate">
<img src="http://www.gcpedia.gc.ca/gcwiki/images/0/04/NavigationBar_Template_AlignRight.png">
</div>
<div class="buttons">
<div>
<a href="http://www.gcpedia.gc.ca/wiki/Help:Navigation_Bar_%E2%80%93_Align_Right_Template" target="_blank">Demo</a>
</div>
<div>
<a href="http://www.gcpedia.gc.ca/gcwiki/index.php?title=Help:Navigation_Bar_%E2%80%93_Align_Right_Template_Source_Code&action=edit" target="_blank">Source Code</a>
</div>
</div>
</div>
<!-- Navigation bar Align Right End -->
</div>
</html>
<style>
.container{
margin:0 auto;
}
.TemplateBox{
margin:0 auto;
margin-top:40px;
margin-bottom:40px;
width:740px;
font-family: arial, sans-serif;
}
.TemplateName{
background-color:#1C507F;
color:aliceblue;
font-weight:bold;
padding:10px 0px 10px 20px;
font-size:20px;
}
.PreviewTemplate{
background-color:#EAEAEA;
width:100%;
text-align: center;
padding-top:25px;
padding-bottom:25px;
}
.buttons{
margin:0 auto;
text-align:center;
padding-top:10px;
padding-bottom:10px;
background-color:#EAEAEA;
height:60px;
width:740px;
}
.buttons div a{
text-decoration:none;
width:46%;
margin-right:2%;
margin-left:2%;
padding-top:15px;
padding-bottom:15px;
float:left;
text-align:center;
color:#fff;
font-weight:bold;
background-color:#1C1C1C;
font-size:16px;
}
.buttons div a:hover {
background-color:#19486B;
text-decoration:underline;
}
</style>
<div class="container">
<!-- Navigation bar Align Left Start -->
<div class="TemplateBox">
<div class="TemplateName">
Align Left
</div>
<div class="PreviewTemplate">
<img src="http://www.gcpedia.gc.ca/gcwiki/images/5/53/NavigationBar_Template_AlignLeft.png">
</div>
<div class="buttons">
<div>
<a href="http://www.gcpedia.gc.ca/wiki/Help:Navigation_Bar_%E2%80%93_Align_Left_Template" target="_blank">Demo</a>
</div>
<div>
<a href="http://www.gcpedia.gc.ca/gcwiki/index.php?title=Help:Navigation_Bar_%E2%80%93_Align_Left_Template_Source_Code&action=edit" target="_blank">Source Code</a>
</div>
</div>
</div>
<!-- Navigation bar Align Left End -->
<!-- Navigation bar Align Center Start -->
<div class="TemplateBox">
<div class="TemplateName">
Align Center
</div>
<div class="PreviewTemplate">
<img src="http://www.gcpedia.gc.ca/gcwiki/images/d/d9/NavigationBar_Template_AlignCenter.png">
</div>
<div class="buttons">
<div>
<a href="http://www.gcpedia.gc.ca/wiki/Help:Navigation_Bar_%E2%80%93_Align_Center_Template" target="_blank">Demo</a>
</div>
<div>
<a href="http://www.gcpedia.gc.ca/gcwiki/index.php?title=Help:Navigation_Bar_%E2%80%93_Align_Center_Template_Source_Code&action=edit" target="_blank">Source Code</a>
</div>
</div>
</div>
<!-- Navigation bar Align Center End -->
<!-- Navigation bar Align Right Start -->
<div class="TemplateBox">
<div class="TemplateName">
Align Right
</div>
<div class="PreviewTemplate">
<img src="http://www.gcpedia.gc.ca/gcwiki/images/0/04/NavigationBar_Template_AlignRight.png">
</div>
<div class="buttons">
<div>
<a href="http://www.gcpedia.gc.ca/wiki/Help:Navigation_Bar_%E2%80%93_Align_Right_Template" target="_blank">Demo</a>
</div>
<div>
<a href="http://www.gcpedia.gc.ca/gcwiki/index.php?title=Help:Navigation_Bar_%E2%80%93_Align_Right_Template_Source_Code&action=edit" target="_blank">Source Code</a>
</div>
</div>
</div>
<!-- Navigation bar Align Right End -->
</div>
</html>
