Hello people, I have the following problem and I hope someone can help me.
my client asked me to see the image complete in the slider use materialize CSS3 anyone knows some way to make the image look in full desktop mode ?, in mobile mode if it looks complete but in PC version is not seen cut someone knows how you could solve that?
My current code:
body{
font-size:20px;
text-align:justify;
margin:0;
padding:0;
}
.nav-wrapper{
background:#ff7334;
}
.nav-content{
background:#0D0D0D;
}
.page-footer{
height:505px;
background:#000000;
}
.contactoinfo{
color:#F2F2F2;
}
.tarjetas{
color:#fff;
}<!DOCTYPE html>
<html ng-app="myApp">
<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>
<script data-require="[email protected]" data-semver="1.3.8" src="https://code.angularjs.org/1.3.8/angular.js"></script>
<script data-require="angular-translate@*" data-semver="2.5.0" src="https://cdn.rawgit.com/angular-translate/bower-angular-translate/2.5.0/angular-translate.js"></script>
<script src="script.js"></script>
<!-- -->
<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>
<script type="text/javascript">
$('.tap-target').tapTarget('open');
$('.tap-target').tapTarget('close');
</script>
<body ng-controller="translateController">
<div ng-controller="translateController" class="nav-wrapper">
<button class="color-idiomas waves-effect waves-light btn" ng-click="changeLanguage('en')">English </button>
<button class="color-idiomas waves-effect waves-light btn" ng-click="changeLanguage('sp')">Spanish</button>
</div>
<nav class="default" role="navigation">
<div class="nav-wrapper">
<a href="#" class="brand-logo center">Lovi Acabados</a>
<a href="#" data-activates="mobile-demo" class="button-collapse show-on-large"><i class="material-icons">menu</i></a>
<ul class="side-nav">
<li><a href="producto1.html">Adoquin</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>
<ul class="side-nav" id="mobile-demo">
<li><a href="producto1.html">Adoquin</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>
</ul>
</div>
</nav>
<div class="slider">
<ul class="slides">
<li>
<img id="active" src="img/inicio.jpg"> <!-- random image -->
<div class="caption center-align">
<h3>Lovi Acabados</h3>
<h5 class="light grey-text text-lighten-3">{{'language' | translate}}</h5>
<p>{{'greeting' | translate}}</p>
</div>
</li>
<li>
<img src="img/2.JPG"> <!-- random image -->
<div class="caption left-align">
<h3>Las mejores piedras de sonora</h3>
<h5 class="light grey-text text-lighten-3">Necesitas decorar tu casa, somos los expertos.</h5>
</div>
</li>
<li>
<img src="img/3.JPG"> <!-- random image -->
<div class="caption right-align">
<h3>Virgenes de Guadalupe</h3>
<h5 class="light grey-text text-lighten-3">Tenemos las mejores estatuas de la virgen de Guadalupe hechas a mano por nuestros expertos.</h5>
</div>
</li>
<li>
<img src="img/5.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>Amas a los animales !</h3>
<h5 class="light grey-text text-lighten-3">Tenemos las mejores esculturas de animales decorativos para tu Hogar.</h5>
</div>
<li>
<img src="img/6.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>Nos has decorado tu casa!</h3>
<h5 class="light grey-text text-lighten-3">Decora tu casa con las mejores piedras de sonora.</h5>
</div>
</li>
<li>
<img src="img/7.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>Dale un toque unico a tu casa</h3>
<h5 class="light grey-text text-lighten-3">Lovi Acabados tenemos las mejores decoracion del estado.</h5>
</div>
</li>
<li>
<img src="img/8.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>Dale Paz y alegria a tu casa!</h3>
<h5 class="light grey-text text-lighten-3">En Lovi Acabados tenemos para ti las virgenes de guadalupe talladas a mano.</h5>
</div>
</li>
<li>
<img src="img/9.JPG"> <!-- random image -->
<div class="caption center-align">
<h3>Dale elegancia a tu casa!</h3>
<h5 class="light grey-text text-lighten-3">Dale elegancia a tu casa con las mejores esculturas de piedra para tu casa.</h5>
</div>
</li>
<li>
<img src="img/logo.png"> <!-- random image -->
<div class="caption center-align">
<h3>Y Muchos Mas Productos!</h3>
<h5 class="light grey-text text-lighten-3">Lovi Acabados es la mejor.</h5>
</div>
</div>
</li>
</ul>
</div>