html - Why two of my <li> are merging? -
i making menu <ul>, need have 2 buttons in same <li> when it, 2 <li> merging. why , how avoid ?
picture better long text :
this menu produce html :
<div id="editarticlemenu" class="col-md-4 col-sm-4 col-xs-4"> <ul> <li class="menu-item"> <h3>edition</h3> </li> <li class="menu-item"> <button class="btn btn-default btn-lg col-md-12 col-sm-12 col-xs-12"> <span class="glyphicon glyphicon-upload icons-left"> </span>publier </button> </li> <li class="menu-item"> <button class="btn btn-default btn-lg col-md-12 col-sm-12 col-xs-12"> <span class="glyphicon glyphicon-tasks icons-left"></span>options de publication <span class="glyphicon glyphicon-chevron-down icons-right"> </span> </button> </li> <li class="menu-item"> <button type="button" class="btn btn-default btn-lg col-md-6 col-sm-12 col-xs-12"> <span class="glyphicon glyphicon-download-alt icons-left"> </span>enregistrer dans les brouillons </button> <button type="button" class="btn btn-default btn-lg col-md-6 col-sm-12 col-xs-12"> <span class="glyphicon glyphicon-eye-open icons-left"> </span>aperçu </button> </li> <li class="menu-item"> <button class="btn btn-default btn-lg col-md-12 col-sm-12 col-xs-12"> <span class="glyphicon glyphicon-tags icons-left"> </span>tags et catégories </button> </li> <li class="menu-item"> <button class="btn btn-default btn-lg col-md-12 col-sm-12 col-xs-12"> <span class="glyphicon glyphicon-book icons-left"> </span>lier une oeuvre </button> </li> <li class="menu-item"> <button class="btn btn-default btn-lg col-md-12 col-sm-12 col-xs-12"> <span class="glyphicon glyphicon-picture icons-left"> </span>ajouter un média </button> </li> </ul> </div> the css :
.menu-item { text-align: center; margin: 10px; } li { display: block; // no changes when list-item }
use padding
.menu-item { text-align: center; padding: 10px; } 
Comments
Post a Comment