Fórum de ajuda por favor,, 2 objetos recusar-se a permanecer na mesma linha

Question

Me desculpe por ser um css noob e gostaria de alguém para me guiar na direção certa.

Página que precisar de ajuda pode ser encontrada em http://filefx.com

Quando você acertar a página, você irá notar que o "Selecionar Arquivos" ícone e "Upload de Arquivos" ícone não estão na mesma linha.

O "Selecionar Arquivos" ícone na verdade, é um psuedo upload ícone que se sobrepõe ao real

Agora, sempre que eu tento colocar os dois ícones ao lado para o outro, o "Upload de Arquivos" ícone é empurrado para a próxima vez e eu preciso desses dois objetos na mesma linha.

Portanto, se alguém o pudesse aconselhar um método para conseguir este feito, você poderia me fazer um campista feliz.

:) Obrigado

Answer 1

aqui está como eu fiz:

o HTML ao redor do botão de upload com o estilo inline eu alterada para:

<div style="position: absolute; right: 0pt; top: 0pt;">     <div id="upload_buttons_container">
        <!--<input type="image" SRC="templates/default/images/Flexshare-Reset.png" id="reset_button" name="reset_button" value="Reset" class="upload">-->
        &nbsp;&nbsp;&nbsp;
        <input type="image" class="upload" value="Upload" name="upload_bn" id="upload_button" src="images/uploadfiles.PNG">
      </div></div>

No CSS eu fiz as seguintes alterações:

.upload {
position:relative;
width:100%;
}

#upload_buttons_container {
width:300px;
}

form .fakeupload {
background:url("../images/selectfiles.PNG") no-repeat 100% 100% transparent;
height:75px;
width:300px;
}

Answer 2

<div style="width:200px;">
<div style="width:98px;float:left;">Select files</div>
<div style="width:98px;float:left;">Upload files</div>
</div>

Answer 3

Tente com:

<div style="float: left; width: 50%;">
select files
</div>
<div style="float: right; width: 50%;">
upload files
</div>

Answer 4

você precisa definir:

.fakeupload precisa ter uma largura ie e float:left

#file_picker_container largura:0;float:left;

A div em volta do botão enviar largura:40%;float:left;

Abra a página usando o firebug e jogar com o CSS