Aumentar tamanho do textfield

[Micilini Roll 49]

olá pessoal esta é a apgina .php que fica o topo:

 

<div id="topo_fundo">

<div id="titulo_topo"><img src="desing/olyng_letra.png" alt="olyng" width="102" height="36" /></div>

<div id="busca">
         <form id="form1" name="form1" method="post" action="?pg=busca">

           <label>
           <input width="180" height="36" type="text" name="pesquisar" id="pesquisar"  />
           </label>
           </form>

       </div>
       <div id="botao">
        <img src="desing/BotaoBuscar.png" alt="olyng" width="108" height="29" />
       </div>

       <div id="menu_usuario">
       <strong><strong>
       </div>
       <div id="menu_config">
       <strong><strong>
       </div>
<div id="menu_sair">
       <strong><strong>
       </div>

</div>

 

e esta é a parte de css:

 

@charset "utf-8";
/* CSS Document */

body{ margin: -13px 0px 0px 0px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#FFFFFF;}

#topo_fundo{
background:url(../desing/only.png) repeat-x;
height:40px;

}
#titulo_topo{
padding-left:30px;
padding-top:1px;
float:left;
}
#busca{
	font-size:200px;
padding-top:8px;
float:left;
margin-left:180px;

}
#botao{
float:left;
padding-top:6px;
}
#menu_usuario{
float:left;
font-family:"Arial Black", Gadget, sans-serif;
margin-left:340px;
font-size:14px;
padding-top:9px;
color:#FFF;
}
#menu_config{
float:left;
font-family:"Arial Black", Gadget, sans-serif;
padding-top:9px;
color:#FFF;
font-size:14px;
margin-left:14px;
}
#menu_sair{
float:left;
font-family:"Arial Black", Gadget, sans-serif;
padding-top:9px;
color:#FFF;
font-size:14px;
margin-left:14px;
}

 

agora é o seguinte o campo textfiled que fica dentro da div busca eu aumento ele de largura mais no apache ele nao fica com o tamanho que coloquei,mas no dreanweaver ele fica!,o que pode estar acontecendo?

[André do Vale 76]

A largura, em caracteres, é feita utilizando o atributo "size". Não existe atributo "width" e "height" para input. Para tal, é necessário formatar com CSS, seja inline, ou em arquivo externo. :thumbsup:

 

http://www.w3schools.com/tags/tag_input.asp

[Willian Makoto 6]

Traduzindo a boa resposta do Andre Campos:

 

<div id="topo_fundo">

<div id="titulo_topo"><img src="desing/olyng_letra.png" alt="olyng" width="102" height="36" /></div>

<div id="busca">
         <form id="form1" name="form1" method="post" action="?pg=busca">

           <label>


               <input class="imasters" type="text" name="pesquisar" id="pesquisar"  />
               </label>


            </form>

       </div>
       <div id="botao">
        <img src="desing/BotaoBuscar.png" alt="olyng" width="108" height="29" />
       </div>

       <div id="menu_usuario">
       <strong><strong>
       </div>
       <div id="menu_config">
       <strong><strong>
       </div>
<div id="menu_sair">
       <strong><strong>
       </div>

</div>

 

Note que ao invés do width/height no input, eu defini uma class para este input (no caso class="imasters") e no css:

 

@charset "utf-8";
/* CSS Document */

body{ margin: -13px 0px 0px 0px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#FFFFFF;}

#topo_fundo{
background:url(../desing/only.png) repeat-x;
       height:40px;

}
#titulo_topo{
       padding-left:30px;
       padding-top:1px;
       float:left;
}
#busca{
       font-size:200px;
       padding-top:8px;
       float:left;
       margin-left:180px;

}
#botao{
       float:left;
       padding-top:6px;
}
#menu_usuario{
       float:left;
       font-family:"Arial Black", Gadget, sans-serif;
       margin-left:340px;
       font-size:14px;
       padding-top:9px;
       color:#FFF;
}
#menu_config{
       float:left;
       font-family:"Arial Black", Gadget, sans-serif;
       padding-top:9px;
       color:#FFF;
       font-size:14px;
       margin-left:14px;
}
#menu_sair{
       float:left;
       font-family:"Arial Black", Gadget, sans-serif;
       padding-top:9px;
       color:#FFF;
       font-size:14px;
       margin-left:14px;
}

.imasters{
   width:180px;
   height:36px;
}

 

é isso!

 

espero ter ajudado, abraço!