Меню динамическое и изменяется через JS.
Если вставить код прост в HTML, все окей меню выравнивается по ширине. Если через JS, то я никак не могу его выровнять по ширине. Оно смещается влево.
Можно как-то сделать подобную вещь?
.menu
{
margin: 0px 30px;
top: 9px;
position: relative;
text-align: justify;
text-align-last: justify;
min-width: 400px;
}
.img_menu
{
position: absolute;
border: 1px solid #1BB38D;
width: 28px;
height: 28px;
}
.title_menu
{
top: 7px;
left: 35px;
display: inline-block;
}
.menu div
{
display: inline-block;
cursor: pointer;
text-align: center;
}
.menu:after
{
content: "";
display: inline-block;
width: 100%;
height: 0;
overflow: hidden;
}
Код JS:
function AddMenuItem(id) {
var tmp = '<div class="item_menu" onmouseover="MenuOver(this);" onmouseout="MenuOut(this);"><table><tr><td style="vertical-align: top; text-align: left; width: 30px;">';
tmp += '<img class="img_menu" alt="111111" src="images/menu/help.png"></td><td style="text-align: left;"><div style="margin-top: 5px;">22241</div></td></tr></table></div>';
return '<div class="item_menu" onmouseover="MenuOver(this);" onmouseout="MenuOut(this);"><table><tr><td style="vertical-align: top; text-align: left; width: 30px;"><img class="img_menu" alt="Перемещение" src="images/menu/trip.png"></td><td style="text-align: left;"><div style="margin-top: 5px;">Перемещения</div></td></tr></table></div>';
}
function MenuGen(menu) {
var tmp = AddMenuItem(0);
for (var i = 1; i < 2; i++) {
tmp += AddMenuItem(i);
}
tmp += AddMenuItem(7) + AddMenuItem(8);
$(".menu").html(tmp);
}
$(function () {
MenuGen(0);
});
Простой
