0
我无法使用materializecss在导航栏上保留带有徽标和记录的用户名的所有ul/li列表？有6个带有用户名的徽标导航，我想保留在导航栏上，但是，我无法将所有这些都保留在导航栏上。徽标出现在导航文本和用户名称下方的导航栏。以下是html代码的一部分。导航栏样式问题与材质框架
<div class="navbar-fixed">
<nav>
<div class="nav-wrapper white black-text">
<a href="" class="brand-logo"> <img style="height: 56px;width: 70px;" src="<?php echo base_url(); ?>assets/images/Pratham-1.png"></a>
<a href="#" data-activates="mobile-demo" class="button-collapse"><i class="material-icons menu">menu</i></a>
<ul class="right hide-on-med-and-down">
<!-- <li><a href=""> <?php echo $name;?></a></li>
<li><a href="<?php echo base_url(); ?>index.php/login/logout">Logout</a></li> -->
<li><a class="dropdown-button" href="#!" data-activates="basicinfo"><i class="material-icons left">language</i>Basic Information<i class="material-icons right">arrow_drop_down</i></a></li>
<li><a class="dropdown-button" href="#!" data-activates="learningresults"><i class="material-icons left">show_chart</i>Learning Results<i class="material-icons right">arrow_drop_down</i></a></li>
<li><a class="dropdown-button" href="#!" data-activates="attendance"><i class="material-icons left">supervisor_account</i>Attendance<i class="material-icons right">arrow_drop_down</i></a></li>
<li><a class="dropdown-button" href="#!" data-activates="monitoringinformation"><i class="material-icons left">search</i>Monitoring Information<i class="material-icons right">arrow_drop_down</i></a></li>
<li><a class="dropdown-button" href="#!" data-activates="others"><i class="material-icons left">speaker_notes</i>Others<i class="material-icons right">arrow_drop_down</i></a></li>
<li><a href="#!"><i class="material-icons left">vertical_align_bottom</i>Download Data</a></li>
<li><a class="dropdown-button" href="#!" data-activates="dropdown1"><?php echo $name;?><i class="material-icons right">arrow_drop_down</i></a></li>
</ul>
<!-- Dropdown for Baisc Info large screen-->
<ul id="basicinfo" class="dropdown-content">
<li><a href="#!">Reach 2016-17</a></li>
<li class="divider"></li>
<li><a href="#!">What is Read? India</a></li>
<li><a href="#!">Tools & MME Formats</a></li>
<li><a href="#!">Implementation models</a></li>
<li><a href="#!">Archives</a></li>
</ul>
<!-- Dropdown for Learnign Levels large screen-->
<ul id="learningresults" class="dropdown-content">
<li><a href="#!">Camp-wise Results</a></li>
<li><a href="#!">Jumps Across Reading Levels</a></li>
<li><a href="#!">Know Your Progress</a></li>
<li><a href="#!">Comparison Reports</a></li>
<li><a href="#!">Goal Tracker</a></li>
</ul>
CSS - 到目前为止我到目前为止，我还尝试过这种尝试这 -
nav {
height: 120px;
line-height: 90px;
font-size: 12px;
}
nav i, nav [class^="mdi-"], nav [class*="mdi-"], nav i.material-icons {
/*height: 30px;
line-height: 30px;*/
}
nav .button-collapse i {
/* height: 30px;
line-height: 30px;*/
}
nav .brand-logo {
font-size: 1.6rem;
}
@media only screen and (min-width: 601px){
nav, nav .nav-wrapper i, nav a.button-collapse, nav a.button-collapse i {
/* height: 30px;
line-height: 30px;*/
}
}
nav a:hover {
color: blue;
/* text-decoration: underline;*/
}
代码片段？如果可能的话 – Gowtham
添加了我的问题代码！ –
CSS？代码将有帮助 – Gowtham