Tenho uma página em PHP que apresenta os meus produtos, alguns itens possuem 4 tamanhos e outros 5 (P, M, G, GG e XGG*). Quando tenho 5 tamanhos, o alinhamento fica correto, mas com 4, ele fica alinhado na esquerda, deixando espaço na direita. Preciso deixar esta lista sempre centralizada, independente de 4 ou 5 itens.
<ul class="tamanhos">
<?php
if($produto[0]->venda_tamanho == 'grade')
{
$temg4 = false;
$temg3 = false;
foreach ($estoques as $estoque)
{
if ($estoque->tamanho == 'xgg') {
$temg3 = true;
}
if ($estoque->tamanho == 'xxgg') {
$temg4 = true;
}
?>
<li class="tamanho-item">
<span class="tam"><?= $estoque->tamanho ?></span>
<?php
if ($estoque->qtde > 0){
?>
<select name="tamanho[<?= $estoque->tamanho ?>]" class="slct-tamanho" data-kit="<?= $produto[0]->kit ?>">
<option value="0">0</option>
<?php
for ($i=1; $i <= $estoque->qtde; $i++) {
?><option value="<?=$i;?>"><?=$i;?></option><?php
}
?>
</select>
<?php
}else{
?>
<a href="<?= base_url('produtos/avisePopup/'.$produto[0]->slug.'/'.$estoque->tamanho) ?>" class="avise-btn">
Avise-me
</a>
<?php
}
?>
</li>
<?php
}
}elseif($produto[0]->venda_tamanho == 'unico'){
?>
<li class="tamanho-item">
<span class="tam"></span>
<select name="tamanho[u]" class="slct-tamanho" data-kit="<?= $produto[0]->kit ?>">
<option value="0">0</option>
<?php
for ($i=1; $i <= $produto[0]->estoque_u; $i++)
{
?>
<option value="<?=$i;?>"><?=$i;?></option>
<?php
}
?>
</select>
</li>
<?php
}
?>
</ul>