Alignement d'un div float:left au centre ?

Question

Alignement d'un div float:left au centre ?

Demandé el 2 de Avril, 2011: Quand la question a-t-elle été
46942 affichage: Nombre de visites la question a
2 Réponses: Nombre de réponses aux questions
Résolu: Situation réelle de la question

Je souhaite qu'un groupe d'images s'affiche horizontalement sur la page. Chaque image a quelques liens en dessous d'elle et je dois donc mettre un conteneur autour de chaque image/groupe de liens.

Ce qui se rapproche le plus de ce que je veux, c'est de les mettre dans des divs qui flottent à gauche. Le problème est que je veux que les conteneurs soient alignés au centre et non à gauche. Comment puis-je y parvenir ?

Demandé el 2 de Avril, 2011 par Mike

Answer 1

2 Réponses

Answer 2

-1voto

Teoman shipahi Points 7988

.contentWrapper {
    float: left;
    clear: both;
    margin-left: 10%;
    margin-right: 10%;
}

.repeater {
    height: 9em;
    width: 9em;
    float: left;
    margin: 0.2em;
    position: relative;
    text-align: center;
    cursor: pointer;
}

Répondu el 19 de Février, 2014 par Teoman shipahi (7988 Points )

0 votes

Il est fortement déconseillé de poster un simple code sans explication.

Commenté el 13 de Mars, 2021 par Stephen M Irving

0 votes

@StephenMIrving c/p même commentaire avec downvote spam aussi découragé. La question est : "Aligner un div float:left au centre ?" et la réponse donnée avec les classes "contentWrapper" et "repeater" est assez explicite. Il ne s'agit pas d'une réponse à une question complexe d'algorithme avec du code uniquement. Je vous suggère d'analyser votre jugement avant d'auto-botter/spammer des réponses uniquement codées avec downvote + même commentaire.

Commenté el 13 de Mars, 2021 par Teoman shipahi

Answer 3

-2voto

Mark Bunschoten Points 1

<html>
<head>
<title>Downloads</title>

<style>
.download-container{
        width:90%;
        margin:0 auto;
        text-align:center;
        border:0px;
        padding:20px;
    }
    .download-cell{
        vertical-align:center;
        height:100px;
        width:340px;
        border:1px solid black;
        border-radius:8px;
        font-size:24px;
        font-color:black;
        z-index:2;
        margin:20px;
        background:white;
        color:black;
        display:inline-block;
        margin:20px;
        padding-top:20px;
    }
</style>
</head>
<body>

<!--DOWNLOADS-->
<div class="download-container">
<br>
    <div class="download-cell">
        <a target="_blank" class="module" href="http://www.woocommerce.com">
        <img src="Images/woo.png" style="width:60px; height:60px;" />
        WooCommerce
        </a>
    </div>

    <div class="download-cell">
        <a target="_blank" class="module" href="http://magento.com">
        <img src="Images/magento.png" style="width:60px; height:60px;" />
        MAGENTO
        </a>
    </div>  

    <div class="download-cell">
        <a target="_blank" class="module" href="http://www.lightspeedhq.com">
        <img src="Images/lightspeed.png" style="width:60px; height:60px;" />
        LIGHTSPEED
        </a>
    </div>  

    <div class="download-cell">
        <a target="_blank" class="module" href="http://www.shopify.com">
        <img src="Images/shopify.png" style="width:60px; height:60px;" />
        SHOPIFY
        </a>
    </div>

    <div class="download-cell">
        <a target="_blank" class="module" href="http://opencart.com">
        <img src="Images/opencart.png" style="width:60px; height:60px;" />
        OPENCART
        </a>
    </div>  

    <div class="download-cell">
        <a target="_blank" class="module" href="http://www.prestashop.com">
        <img src="Images/prestashop.png" style="width:60px; height:60px;" />
        PRESTASHOP
        </a>
    </div>

    <div class="download-cell">
        <a target="_blank" class="module" href="http://www.wix.com">
        <img src="Images/wix.png" style="width:60px; height:60px;" />
        WIX eCommerce
        </a>
    </div>                                          
</div>

</body>
</html>

Répondu el 13 de Mars, 2021 par Mark Bunschoten (1 Points )

Alignement d'un div float:left au centre ?

Réponses

Questions en vedette

Top Tags

Prograide.com

Powered by:

Alignement d'un div float:left au centre ?

Réponses

Questions en vedette

Top Tags

Dans notre réseau

Prograide.com

Powered by: