Sobre HTML5 e CSS3 - Criação de Site

[Ainda Aprendendo 0]

Eu quero deixar um arquivo ao lado do outro. como por exemplo uma simples foto.

vamos supor que esse seja o codigo. tem a imagem que eu quero e o botão.

como você pode ver tem 2 imagens ai. a 2555487.jpg [[imagem 1]] e a 2875444.jpg [[imagem 2]] a minha duvida é o seguinte.

a [[imagem 1]] está no local certo. já [[imagem 2]] está a baixo dela. eu não queri isso, eu quero ela ao lado. com um conteudo diferente. quando você clica ele redireciona para uma nova .HTML. ou seja abrindo uma nova pagina.

 <ul class="post">

            <li>

                <div class="imageml2">

                    <img src="_p2p/interlude/_imagens/2555487.jpg" title=" ---------- " rel="tooltip" alt="  -----------   "/>

                    <a href="_p2p/interlude/subx3.html"/>

                    	 <span class="player" rel="tooltip" alt=" ---------- " title=" -------- "/>

                    </a>

                </div>


                <div class="imageml2">

                    <img src="_p2p/interlude/_imagens/2875444.jpg" title=" ---------- " rel="tooltip" alt="  -----------   "/>

                    <a href="_p2p/interlude/subx32.html"/>

                    	 <span class="player" rel="tooltip" alt=" ---------- " title=" -------- "/>

                    </a>

                </div>

            </li>

        </ul>          

CSS


.items ul.post li {

    float: left;

    ;

    margin-top: -40px;

    position: relative;

    width: 185px;

}


.items ul.post li .imageml2 {

  border: 0px;

  float: left;

  height: 160px;

  margin: 0 10px 20px;

  position: relative;

  width: 107px;

}


.items ul.post li .imageml2 h2 {

    display:none;

}


.items ul.post li .imageml2 img {

    height:160px;

    width:107px;

}

a {

    outline:0;

    text-decoration:none;

}

Resumindo tudo. olha essa imagem. são 3 imagens diferentes, uma ao lado da outra. as minhas não estão assim. elas estão uma em baixo da outra e eu quero ao lado.

Qual é o código.

PS: EU SOU PÉSSIMO PARA EXPLICAR. ENTÃO DESCULPA HAHHAHA

[Maujor 144]

Declare: SEM EFEITO - Ver minha resposta seguinte.

.imagem12 { float: left; }

[William Bruno 1501]

Poste um link para vermos o motivo de não ter funcionado.

 

Tecnicamente com o float: left já era para ter ficado uma do lado da outra.

Se não está, tem algo mais interferindo.

[Maujor 144]

Não está funcionando porque foi declarada uma largura para o container dos floats (elemento LI) igual a 185px que é menor do que a soma das larguras declaradas para as imagens 107px + 107px = 214px.

A largura mínima do container deverá ser 214px mais margens laterais das imagens (10+10+10+10), ou seja, 254px.

[Ainda Aprendendo 0]

no caso.

}

.items ul.post li {
    float: left;
    ;
    margin-top: -40px;
    position: relative;
    width: 260px;
}

funcionou. muito obrigado