¿Cómo hacer esta linea Horizontal?

  • Autor Autor WebmasterKing
  • Fecha de inicio Fecha de inicio
WebmasterKing

WebmasterKing

Kappa
Verificación en dos pasos activada
Verificado por Binance
Hola amigos!

Pagina: Que debo añadir al codigo para que esta linea en vez de vertical sea horizontal:
Screenshot_77.webp

Quiero que sea asi: 21 22 23 24 25 26

HMTL:

HTML:
    </div>
    <div class="circulo">
        <h2>21</h2>
    
         </div>
    <div class="circulo">
        <h2>22</h2>
         </div>
    <div class="circulo">
        <h2>23</h2>
        
         </div>
    <div class="circulo">
        <h2>24</h2>
         </div>
    <div class="circulo">
        <h2>25</h2>
         </div>
        
    <div class="circulo color__fondo">
        <h2>26</h2>
        
    </div>
</div>

CSS
CSS:
.circulos {
    width: 500px;
    display: flex;
}

.circulo {
    width: 60px;
    height: 60px;
    color: #737373;
    border-radius: 50%;
    background-color: #efefff;
    border: 0 solid #efefff;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 5px;
    margin-bottom: 5px;
}

.circulo:nth-child{
    color: #ffffff;
    background-color: #6f70ff;
    border: 0px solid #0100fe;
    
}

.circulo:nth-child(7){
    color: #ffffff;
    background-color: #ff6162;
    border: 0px solid #ff6162;

}

.circulo > h2 {
    font-size: 25px;
    font-weight: bold;
    font-family: sans-serif;
    margin: 0px;align-content         
}
 
.circulo {
display: inline-block;
justify-content: center;
align-items: center;
}
 
Añadelo en el codigo CSS:

.circulo > h2 {
margin:10px;
 
Atrás
Arriba