How to mount columns from <ul>?

Asked

Viewed 86 times

2

I have this code and I would like every four results to be entered a <ul></ul> to make columns of 25% wide and get exactly 4 columns. How can I do?

<ul>
    <li>
        <?php echo $i; ?>x <strong>R$ <?php echo number_format($preco_parcela, 2, ',', '.');?></strong>
        <?php echo $texto_juros?><?php echo " = R$ " . number_format( $i * $preco_parcela, 2, ',', '.'); ?>
    </li>
</ul>

1 answer

1

The best solution would be to use DIVS.

Regardless of the number of results, the layout would fit by putting the results side by side and still give to apply a manually responsive or boostrap classes (.span3 per ex).

Example:

<div class="content">
    <div class="item">
    Div com 25% largura e regras para responsivo.
    </div>
    <div class="item">
    Div com 25% largura e regras para responsivo.
    </div>
    <div class="item">
    Div com 25% largura e regras para responsivo.
    </div>
    <div class="item">
    Div com 25% largura e regras para responsivo.
    </div>
    <div class="item">
    Div com 25% largura e regras para responsivo.
    </div>
    <div class="item">
    Div com 25% largura e regras para responsivo.
    </div>
</div>
<!-- end content -->

CSS:

.content { width: 100%; max-width: 1170px; /*size you use on the site. */ overflow: Hidden; }

.content. item { width: 23%; margin: 10px 1%; }

@media screen and (max-width: 768px) { .content. item { width: 48%; margin: 10px 1%; } }

@media screen and (max-width: 480px) { .content. item { width: 100%; margin: 10px auto; }

}

Browser other questions tagged

You are not signed in. Login or sign up in order to post.