Problem: Align items on the far right and the far left (HTML)-CodePudding

Picture of the ProblemI want to align my certifications on the far left and the month/year on the far right. However, when I float right and left it pulls Education in between the certification and the month/year. What could be the problem? I have added the HTML and CSS code below HTML Code CSS Code

CodePudding user response：

Try to delete space before and after =

CodePudding user response：

When you use float on an element it is taken from flow of the document hence the you face the problem. For your case put the certificates and dates in a div element which spans the whole page and give it a property display: inline-block; width:100%;, the two ul elements inside it which floats left and right.

Example code:

<div style="display: inline-block; width:100%">
  <ul style="float:left">
    <li>Cetificate name</li>
    <li>Certificate name</li>
  </ul>
  <ul style="float:right; ">
    <li>2019</li>
    <li>2020</li>
  </ul>
</div>

<ul >
  <li>Detail 1</li>
  <li>Detail 2</li>
</ul>