Mensajes

Muestra

Para empezar vamos a ver un ejemplo de dos elementos, un botón por un lado y el mensaje por otro.

Botón Bodyui

   
        Botón Bodyui
    
    
        
            Botón Bodyui

Colores

Vamos describir los colores de los mensajes para que queden documentados.

Bodyui Bodyui Bodyui Bodyui

Red Red Red Red

Blue Blue Blue Blue

Green Green Green Green

Black Black Black Black

White White White White

Grey Grey Grey Grey

    
        Bodyui
        Bodyui
        Bodyui
        Bodyui
    
    
        Red
        Red
        Red
        Red
    
    
        Blue
        Blue
        Blue
        Blue
    
    
        Green
        Green
        Green
        Green
    
    
        Black
        Black
        Black
        Black
    
    
        White
        White
        White
        White
    
    
        Grey
        Grey
        Grey
        Grey

Para utilizar correctamente este elemento hay qye utilizar las clases pertinentes de direccionamiento badge-mje-[psición] donde posición es la dirección del pseudoelemento asiciado al mensaje (TOP / RIGTH / BOTTOM / LEFT). Ahora bién, para posicionar correctamente este elemento es necesario utilizar las claes de Flexbox de manera correcta, caso contrario siempre les va a quedar desalineado.