Dompdf Why When you go to second page the text goes to the left

Question

I have a simple pdf that I created with dompdf div and css.

 #menu{
        width:600px;
        float:left;
        margin-top:10px;
        font-weight: bold;   }
            
             

#Istarih{ float:left; width:180px; margin-right:0px; font-weight: bold; }

 #Isdeneyimi{
          float:left;
          width:500px;
          word-wrap:break-word;
          margin-right:0px;   }
            
.clear
            {
                clear:both;
                height:10px;
            }






<div>
    <div id="menu">WORK</div>
    <div class="clear"></div>
    <div id="Istarih">2002</div><div id="Isdeneyimi"><b>WORK</b><br>WORK<br><br> blblablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablablaablabla <br></div><div class="clear"></div>
    </div>

When you go to second page the text goes to the left

How can I solve this problem?

Dompdf Long Text Problem

Answer 1

On the second page the first floated element is no longer present and thus no longer impacts the second element. With this particular layout, if you wanted to maintain the margin all the way through the document you would want to style the second element differently. Remove the float from that element and give it a margin equal to the space occupied by the floated element.

#Isdeneyimi {
    width:500px;
    word-wrap:break-word;
    margin-right:0px;
    margin-left: 180px;
}

Margins of in-flow elements adjacent to floated elements overlay the flow. The above styling will have the same effect as floating siblings but will maintain the margin across pages.