body {
    background-color: rgb(255, 255, 255);
}

#padre{
    width:100%;
    height: 230px;
    background-color: violet;
    padding: 10px; /* el padding suma la cantidad propuesta arriba y abajo*/
}

#hijo1{
    width: 20%;
    height: 230px;
    background-color: yellow;
    float:left;
}

#hijo2{
    width: 20%;
    height: 230px;
    background-color: blue;
    float:left;
    margin-left: 10px;
}

#hijo3{
    width: 20%;
    height: 230px;
    background-color: red;
    float:left;
    margin-left: 10px;
}
/* margin: 10px 10px 10px 10px ; este sirve para citar los 4 valores.*/
/* margin: 10px 20px; este sirve para citar los 2 valores horizontal (arriba y abajo) y vertical (izquierda derecha).*/
/* margin: 10px; este sirve para citar todos los valores.*/