Hello friends, I have the following project and everything works correctly but when I reach dimension 2560x1440 as far as I am aware, it is the largest dimension of Computer. Consult this website for that: link , but what I do not understand is because the menu disappears, I thought it was a mistake of the menu label but no, copy and paste again the framework structure materialize css, would someone know why?
My code is this: (note uni all the code so that they saw it completely, I have it separated in its determined files: the html5 with the html5 and the css in its folder css) I am new with this Framework.
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0"/>
<title>Lovi acabados</title>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="css/materialize.css" type="text/css" rel="stylesheet"/>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<style type="text/css">
.nav-wrapper{
background:#ff7334;
}
.nav-content{
background:#0D0D0D;
}
.page-footer{
height:505px;
background:#000000;
}
.contactoinfo{
color:#F2F2F2;
}
.tarjetas{
color:#fff;
}
/*MENU*/
</style>
<body>
<nav style="background:#ff7334;" class="lighten-1" role="navigation">
<div style="background:#ff7334; class="nav-wrapper container"><a id="logo-container" href="#" class="brand-logo">Lovi acados</a>
<ul id="nav-mobile" class="side-nav">
<li><a href="producto1.html">Adoquín</a></li>
<li><a href="producto2.html">Azulejo</a></li>
<li><a href="producto3.html">Barro</a></li>
<li><a href="producto4.html">Block</a></li>
<li><a href="producto5.html">Cantera</a></li>
<li><a href="producto6.html">Esculturas reducidas</a></li>
<li><a href="producto7.html">Fuentes</a></li>
<li><a href="producto8.html">Granito</a></li>
<li><a href="producto9.html">Iluminación</a></li>
<li><a href="producto10.html">Jacuzzi</a></li>
<li><a href="producto11.html">Ladrillo refractario</a></li>
<li><a href="producto12.html">Mármol</a></li>
<li><a href="producto13.html">Piedras decorativas</a></li>
<li><a href="producto15.html">Piso</a></li>
<li><a href="producto17.html">Sanitarios</a></li>
<li><a href="producto16.html">Tejas</a></li>
</ul>
<a href="#" data-activates="nav-mobile" class="button-collapse"><i class="material-icons">menu</i></a>
</div>
</nav>
<!-- Galeria principal -->
<div id="test1" class="col s12">
<div class="slider">
<ul class="slides">
<li>
<img id="active" src="img/logo.png"> <!-- random image -->
<div class="caption center-align">
<h3>Lovi Acabados</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
</li>
<li>
<img src="img/2.JPG"> <!-- random image -->
<div class="caption left-align">
<h3>Left Aligned Caption</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
</li>
<li>
<img src="img/3.JPG"> <!-- random image -->
<div class="caption right-align">
<h3>Right Aligned Caption</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
</li>
<li>
<img src="img/5.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>This is our big Tagline!</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
<li>
<img src="img/6.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>This is our big Tagline!</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
</li>
<li>
<img src="img/7.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>This is our big Tagline!</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
</li>
<li>
<img src="img/8.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>This is our big Tagline!</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
</li>
<li>
<img src="img/9.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>This is our big Tagline!</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
</li>
<li>
<img src="img/10.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>This is our big Tagline!</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
</li>
<li>
<img src="img/11.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>This is our big Tagline!</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
</li>
<li>
<img src="img/13.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>This is our big Tagline!</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
</li>
<li>
<img src="img/13.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>This is our big Tagline!</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
</li>
<li>
<img src="img/14.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>This is our big Tagline!</h3>
<h5 class="light grey-text text-lighten-3">Here's our small slogan.</h5>
</div>
</li>
</li>
</ul>
</div>
<div class="section no-pad-bot" id="index-banner">
<div class="container">
<br><br>
<h4 class="header center orange-text">Para vestir tu casa con elegancia y distinción.</h4>
<div class="row center">
<h5 class="header col s12 light">Lovi Acabados es la solución.</h5>
</div>
<br><br>
</div>
</div>
<div id="test2" class="col s12">
<div class="container">
<h4>Quien Somos</h4>
Lovi Acabados es una compañía dedicada a la venta de materiales y escultura de diferentes tipos de excelente acabado: mármol, granito, cantera, adoquín, cerámica; todo disponible para una presentación adecuada para los hogares.
También vendemos iluminación decorativa, jacuzzis y otros componentes para la decoración de hogar.
</div>
<div class="container">
<h4>Nuestra Meta</h4>
Sticky Footer
A sticky footer always stays on the bottom of the page regardless of how little content is on the page. However, this footer will be pushed down if there is a lot of content, so it is different from a fixed footer. Add the following code to your CSS file.
Note: This may cause issues in Internet Explorer which has weak support for flexbox.Sticky Footer
A sticky footer always stays on the bottom of the page regardless of how little content is on the page. However, this footer will be pushed down if there is a lot of content, so it is different from a fixed footer. Add the following code to your CSS file.
Note: This may cause issues in Internet Explorer which has weak support for flexbox.Sticky Footer
A sticky footer always stays on the bottom of the page regardless of how little content is on the page. However, this footer will be pushed down if there is a lot of content, so it is different from a fixed footer. Add the following code to your CSS file.
Note: This may cause issues in Internet Explorer which has weak support for flexbox. </div>
</div>
<br><br><br><br><br><br><br><br><br>
<footer style="background:black;" class="page-footer">
<div class="container">
<div class="row">
<div class="col l6 s12">
<center>
<p class="tarjetas">Recibimos todas las tarjetas</p>
<p class="tarjetas">Bienvenidas todas sus tarjetas</p>
<p class="tarjetas">Contamos con terminal movil p/ cobrar a domicilio.</p>
<img class="responsive-img" src="https://upload.wikimedia.org/wikipedia/commons/c/cc/Credit_card_logos_%282015-12-1816-27-350044%29.jpg" width="200" height="200" />
</center>
</div>
</div>
</div>
<div class="row">
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<div class="row">
<form class="col s12">
<div class="row">
<div class="container contact">
<h5>Contacto</h5>
<p style="color:black;" class=" text-lighten-4">Lovi Acabados: La empresa de cerámica del noroeste.</p>
<hr>
<div class="row">
<div class="col s12 m6 l6">
<div class="row">
<form accept="" method="POST" class="col s12">
<div class="row">
<div class="input-field col s6">
<input id="first_name" type="text" class="validate">
<label for="first_name">First Name</label>
</div>
<div class="input-field col s6">
<input id="last_name" type="text" class="validate">
<label for="last_name">Last Name</label>
</div>
</div>
<div class="row">
<div class="input-field col s12">
<input id="email" type="email" class="validate">
<label for="email">E-Mail</label>
</div>
</div>
<textarea class="materialize-textarea" placeholder="Your Message" required></textarea>
<button style="background:#ff7334;" class="btn waves-effect waves-light" type="submit" name="submit">Enviar
<i class="mdi-content-send right"></i>
</button>
</form>
</div>
</div>
<div class="col s12 m6 l6 contact-holder">
<h6 class="mdi-action-home">Direccion</h6>
<p >Barrio La Mision Carretera Internacional Km 181 Salida Sur, Magdalena de Kno C.P 84160</p>
<h6 class="mdi-hardware-phone-android">Tel:</h6>
<p >Oficina Tel 6323 - 224515</p>
<div class="container">
© 2017 Copyright Lovi acabados
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="js/materialize.js"></script>
<script src="js/init.js"></script>
<script src="js/script.js"></script>
</body>
</html>