how can i make a text before other one even if they are in the same div-CodePudding

div {
 background-color: rgb(209, 209, 209);
 text-align: center;
 padding: 20px;
 font-size: 20px;
 font-family: Arial, Helvetica, sans-serif;
 margin: 0 100px;
}
                      
div::before {
  content: "";
}

how can i put the one as a before what should i write in the content

CodePudding user response：

enter code here div{
                    background-color: rgb(209, 209, 209);
                    text-align: center;
                    padding: 20px;
                    font-size: 20px;
                    font-family: Arial, Helvetica, sans-serif;
                    margin: 0 100px;

                    }
                  
                  div::before{
                              content: "";
                  }

inside a content for example:

enter code here div{
                    background-color: rgb(209, 209, 209);
                    text-align: center;
                    padding: 20px;
                    font-size: 20px;
                    font-family: Arial, Helvetica, sans-serif;
                    margin: 0 100px;

                    }
                  
                  div::before{
                              content: "This is Hamza";
                  }

CodePudding user response：

try something like this

div{
float:left;
}
.span1{
color:green;
}
.span2{
color:red;
}

<div>
    <span >
      I'm the left content of the div   
    </span>
    <span >
       I'm the right content of the div 
    </span>
</div>