HTML & CSS - li items/ div's are going where they should.

[armstr38]

CSS Code

#info-section{
  width: 700px;
  margin-top: 30px;
}

#info-section ul li{
  display: inline-block;
  list-style: none;
}

/*#image-section img{
  width: 400px;
  height: 270px;
}*/

.info-img img{
  max-width: 400px;
  max-height: 270px;
}

.text-section{
  width: 200px;
  height:270px;
  background-color: #1b1b1b;
  margin-left: 400px;
  color: #fff;
  position: absolute;
}

/* #text-section{
  width: 200px;
  height:270px;
  background-color: #1b1b1b;
  position: relative;
} */

HTML CODE

 <div id="info-section">
    <!--  <div id="image-section">
        <img src="images/bigpeg.png">
      </div>
      <div id="text-section">
        <p>
          Hello
        </p>
      </div>-->

      <ul>
        <li class="info-img">
          <img src="images/bigpeg.png" alt="The Big Peg - Jewellery Quarter">
        </li>
        <li class="text-section">
          Hello
        </li>
      </ul>
    </div>

I don't know whats wrong this code, all the other parts work perfectly fine.

Thanks in advance.

[gentlemedia]

So... what's the problem? I can see you're trying to align the text next to the image with some CSS kung-fu, but what other parts are you talking about?

@armstr38

Please state exactly what the issue is with which element. If possible show a screenshot and state what should be happening. Are the commented out CSS and HTML sections relevant? If not, why include them?
Also provide relevant tags for your "question".