look @ 2 images, , please tell me going on?
why icons moving ?
i'm stuck on hour...
the icons must align on right or left, 3 icons "floating left" still this...
<!doctype html> <html lang="en" ng-app="myapp"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- above 3 meta tags *must* come first in head; other head content must come *after* these tags --> <meta name="description" content=""> <meta name="author" content=""> <!--import google icon font--> <link href="http://fonts.googleapis.com/icon?family=material+icons" rel="stylesheet"> <!--import materialize.css--> <link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/> <!--let browser know website optimized mobile--> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <title>duall sistemas</title> <!-- bootstrap core css --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <link rel="stylesheet" type="text/css" href="css/materialize.css"> <link rel="stylesheet" type="text/css" href="css/custom.css"> <link rel="stylesheet" type="text/css" href="libs/bootstrap/bootstrap-social.css"> <link rel="stylesheet" type="text/css" href="libs/font-awesome/css/font-awesome.css"> <base href="/index.ejs"> </head> <body> <div class="navbar-fixed"> <nav> <div class="row"> <div class="col s12 "> <div class="nav-wrapper"> <a href="/home" class="brand-logo">duall sistemas</a> <a href="#" data-activates="mobile-demo" class="button-collapse right"><i class="material-icons">menu</i></a> <ul class="right hide-on-med-and-down"> <li><a href="/home">principal</a></li> <li><a href="/contact">contato</a></li> <li><a href="/about">sobre</a></li> </ul> <!-- menu para mobile --> <ul class="side-nav" id="mobile-demo"> <li> <div class="userview"> <img class="background" src="img/image03.jpg"> <a href="#!user"><img class="circle" src="img/duallsistemas.png"></a> <a href="/home"><span class="white-text name">duall sistemas</span></a> <a href="#!email"><span class="white-text email">duallsistemas@gmail.com</span></a> </div> </li> <li><a href="/home"><i class="material-icons">home</i>principal</a></li> <li><a href="/contact"><i class="material-icons">mail</i>contato</a></li> <li><a href="/about"><i class="material-icons">favorite border</i>sobre</a></li> </ul> <script> $(document).ready(function(){ $(".button-collapse").sidenav({ closeonclick: true }); }) </script> </div> </div> </div> </nav> </div> <!-- div que recebe views na pasta partials de acordo com os controlleres --> <div class="container" id="container-main"> <div ng-view> </div> </div> <!-- scripts para inicializar o angular e seus controladores --> <script type="text/javascript" src="libs/jquery/jquery.js"></script> <script type="text/javascript" src="js/materialize.js"></script> <script type="text/javascript" src="libs/angular/angular.js"></script> <script type="text/javascript" src="libs/angular-route/angular-route.js"></script> <script type="text/javascript" src="libs/angular-resource/angular-resource.js"></script> <script type="text/javascript" src="js/app.js"></script> <script type="text/javascript" src="libs/angular-bootstrap/ui-bootstrap-tpls.js"></script> <script type="text/javascript" src="js/controllers/homecontroller.js"></script> <script type="text/javascript" src="js/controllers/navcontroller.js"></script> <script type="text/javascript" src="js/controllers/aboutcontroller.js"></script> <script type="text/javascript" src="js/controllers/contactcontroller.js"></script> <script type="text/javascript" src="js/services/api.js"></script> </body> </html>
it looks though floating icons left , following elements catching on it.
try setting clear left on lis.
li {clear: left;} 
Comments
Post a Comment