Change sticky menu color and put the footer into full screen

2 replies·opened Sep 21, 2017
P
pentakillSep 21, 2017

How do I change the sticky menu color?

Currently it is grey. I want it to be black. I will attach my index below.

Also how do I do so that Footer are inside the full screen? Now the video and header is fullscreen but we have to scroll down to see the footer.
I want my footer to also be inside the fullscreen. How do I do that?

P
pentakillSep 21, 2017
<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>

	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<meta name="author" content="SemiColonWeb" />

	<!-- Stylesheets
	============================================= -->
	<link href="http://fonts.googleapis.com/css?family=Lato:300,400,400italic,600,700|Raleway:300,400,500,600,700|Crete+Round:400italic" rel="stylesheet" type="text/css" />
	<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
	<link rel="stylesheet" href="style.css" type="text/css" />
	<link rel="stylesheet" href="css/dark.css" type="text/css" />
	<link rel="stylesheet" href="css/font-icons.css" type="text/css" />
	<link rel="stylesheet" href="css/animate.css" type="text/css" />
	<link rel="stylesheet" href="css/magnific-popup.css" type="text/css" />

	<link rel="stylesheet" href="onepage.css" type="text/css" />

	<link rel="stylesheet" href="css/responsive.css" type="text/css" />
	<meta name="viewport" content="width=device-width, initial-scale=1" />

	<!-- Document Title
	============================================= -->
	<title>Contact - MingHong</title>

</head>

<body class="stretched">

	<!-- Document Wrapper
	============================================= -->
	<div id="wrapper" class="clearfix">

		<!-- Header
		============================================= -->
	<header id="header" class="full-header transparent-header dark static-sticky" data-sticky-offset="0">

			<div id="header-wrap" style="background-color: #000;">

				<div class="container clearfix">

					<div id="primary-menu-trigger"><i class="icon-reorder"></i></div>

					<!-- Logo
					============================================= -->
					<div id="logo">
						<a href="index.html"><img src="images/logo.png" alt="Minghong Logo" /></a>
						<a href="index.html"><img src="images/logo@2x.png" alt="Minghong Logo" /></a>
					</div><!-- #logo end -->

					<!-- Primary Navigation
					============================================= -->
					<nav id="primary-menu">

						<ul class="one-page-menu" data-easing="easeInOutExpo" data-speed="1250" data-offset="65">
							<li><a href="#"><div>Home</div></a></li>
							<li><a href="product.html"><div>Product</div></a>
							<ul>
							<li><a href="#"><div>Electric Car</div></a></li>
							<li><a href="#"><div>Electric Passenger Tricycle</div></a></li>
							<li><a href="#"><div>Electric Cargo Tricycle</div></a></li>
							</ul>
							</li>

							<li><a href="#"><div>Company</div></a>
							<ul>
							<li><a href="#"><div>Company Overview</div></a></li>
							<li><a href="#"><div>Our Advantages</div></a></li>
							<li><a href="#"><div>Industrial Certification</div></a></li>
							</ul>
							</li>

							<li><a href="#"><div>About us</div></a>
							<ul>
							<li><a href="#"><div>Business Performance</div></a></li>
							<li><a href="#"><div>Management team</div></a></li>
							<li><a href="#"><div>FAQ</div></a></li>
							</ul>
							</li>

							<li><a href="contact.html"><div>Contact</div></a></li>
						</ul>

					</nav><!-- #primary-menu end -->

				</div>

			</div>

		</header><!-- #header end -->

				<div class="section parallax dark nomargin noborder" style="padding: 150px 0; background-image: url('images/contact/contact1.jpg');" data-stellar-background-ratio="0.4">
					<div class="container center clearfix">
						<div class="emphasis-title">
							<h2></h2>

						</div>

					</div>
				</div>

		<section id="content">

			<div class="content-wrap">

				<div class="container clearfix">

					<!-- Google Map
					============================================= -->
					<div class="col-md-6 bottommargin">

						<script src='https://maps.googleapis.com/maps/api/js?AIzaSyAcvhk28LvNyssGlGabhNP2tZw2cOKXpjM'></script><div style='overflow:hidden;height:440px;width:700px;'><div id='gmap_canvas' style='height:440px;width:65%;'></div><div><small><a href="http://embedgooglemaps.com">Click here to generate your map!</a></small></div><div><small><a href="https://www.amazon.com/gp/product/B073GVZSRG/ref=s9_acsd_newrz_hd_bw_b3IfBi7_c_x_w?pf_rd_m=ATVPDKIKX0DER&pf_rd_s=merchandised-search-4&pf_rd_r=2ZP7WR5QJ3XJW43GWD6V&pf_rd_t=101&pf_rd_p=1c652d50-4986-5dac-bbfa-2c83eae8e6b6&pf_rd_i=3024189011">Best dog carrier slings in UK</a></small></div><style>#gmap_canvas img{max-width:none!important;background:none!important}</style></div><script type='text/javascript'>function init_map(){var myOptions = {zoom:10,center:new google.maps.LatLng(31.104878,121.40298069999994),mapTypeId: google.maps.MapTypeId.ROADMAP};map = new google.maps.Map(document.getElementById('gmap_canvas'), myOptions);marker = new google.maps.Marker({map: map,position: new google.maps.LatLng(31.104878,121.40298069999994)});infowindow = new google.maps.InfoWindow({content:'<strong>MingHong</strong><br>Mingxing Road 100<br>'});google.maps.event.addListener(marker, 'click', function(){infowindow.open(map,marker);});infowindow.open(map,marker);}google.maps.event.addDomListener(window, 'load', init_map);</script>

						<a href="https://goo.gl/maps/F9USCYQDT4m">Link to Google map</a>

					</div><!-- Google Map End -->

					<div class="col-md-6">

						<!-- Contact Info
						============================================= -->
						<div class="col_two_fifth">

							<address>
								<h2><strong>Contact Us</strong></h2>
								Mingxing Road 100,Chuanshan Area,.
629000 China (Mainland)<br>
Sichuan,Suining

							</address>
							<abbr title="Phone Number"><strong>Phone:</strong></abbr> (91) 8547 632521<br>
							<abbr title="Fax"><strong>Fax:</strong></abbr> (91) 11 4752 1433<br>
							<abbr title="Email Address"><strong>Email:</strong></abbr> info@minghong.com

						</div><!-- Contact Info End -->

						<div class="clear"></div>

					</div>

				</div>

			</div>

		</section><!-- #content end -->

		<!-- Footer
		============================================= -->
		<footer id="footer" style="background-color: #000; color: #c9c6c6;">

			<div class="container center">
				<div class="footer-widgets-wrap" style="padding: 0;">

					<div>

					<div class="col-md-4">

							<div class="widget clearfix">

								<p style="margin-top: 30px;">Minghong Vehicle Production Co.,Ltd @ 2017 </p>

							</div>

						</div>

						<div class="col-md-4">

							<div class="widget clearfix">

									<div class="center" style="margin-top: 30px;">
									<a href="#" title="Facebook">
										<i class="icon-facebook"></i>
										<i class="icon-facebook"></i>
									</a>
									<a href="#" title="Twitter">
										<i class="icon-twitter"></i>
										<i class="icon-twitter"></i>
									</a>
									<a href="#" title="Github">
										<i class="icon-github"></i>
										<i class="icon-github"></i>
									</a>
									<a href="#" title="Pinterest">
										<i class="icon-pinterest"></i>
										<i class="icon-pinterest"></i>
									</a>
								</div>
							</div>

						</div>

						<div class="col-md-4">

							<div class="widget clearfix">
											<p style="margin-top: 30px;">Contact: <a href="mailto:info@minghong.com">info@minghong.com</a></p>

							</div>

						</div>

					</div>

				</div>
			</div>

		</footer><!-- #footer end -->

	</div><!-- #wrapper end -->

	<!-- Go To Top
	============================================= -->
	<div id="gotoTop" class="icon-angle-up"></div>

	<!-- External JavaScripts
	============================================= -->
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/plugins.js"></script>

	<!-- Footer Scripts
	============================================= -->
	<script type="text/javascript" src="js/functions.js"></script>

</body>
</html>
S
SemiColonWebSTAFFSep 24, 2017

Hello,

Can you please provide us with a Live URL so that we can check out the exact issue and provide you with a more accurate solution for this. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard