CSS ile Arama Butonu Biçimlendirme

EmreEfe

Hectopat
Katılım
14 Kasım 2015
Mesajlar
222
Daha fazla  
Cinsiyet
Erkek
Merhaba, ASP.NET öğrenmek amaçlı CSS ve ASP.NET kullanarak bir site yazaya çalışıyorum. Fakat arama Textboxu ayarladığım yere değilde aşağı kayıyor. Düzeltemedim bir türlü.




CSS Kodları:
Kod:
body {
    background: #d5d5d5;
    font-family: 'Trebuchet MS', Arial, 'Comic Sans MS'
}

*{
    margin : 0;
    padding: 0;
    border: 0;
}

#wrapper{
    width: 960px;
    height: 1100px;
    margin : 0 auto;
   
}

header{
    float: left;
    width:100%;
    height:45px;
    background-color:#fff;

}

header .logo{
    float: left;
    width:89px;
    border-right: 1px solid #ff0000;
    background-color: #fff;
    text-align: center;
    line-height:45px;
    color: #990000;

}

header nav{
    width: 609px;
    height: 45px;
    border-right: 1px solid #ff0000;
    line-height: 45px;
}

header nav ul{
    list-style-type: none;
}

header nav ul li {
    float: left;
    margin-left: 15px;
    color:#555;
}

header .arama-wrap{
    float:left;
    width: 260px;
    height: 45px;

}

ASP.NET Kodu:
PHP:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="jupiter._default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Deneme</title>

    <link href="/style.css" rel="stylesheet" />

</head>
<body>
    <form id="form1" runat="server">
        <div id="wrapper">
       
                 <header>

                            <div class="logo">
                                LOGO
                            </div>
                           
                                <nav>
                                     <ul>

                                            <li> Anasayfa </li>
                                            <li> Konular </li>
                                            <li> Duyurular </li>
                                            <li> İletişim </li>

                                     </ul>
                                 </nav>



                                <div class ="arama-wrap">

                                   
                                    <asp:TextBox ID="txtArama" CssClass="txtArama" runat="server"></asp:TextBox>


                                </div>
                 </header>  

        </div>
    </form>
</body>
</html>
 
Son düzenleme:
Float uyguladığın nesnelerin kapsayıcısına ya "overflow: hidden" uygula ya da kapsayıcıyı kapatmadan "clear: both" değerini taşıyan bir "div" ekle. Diğer yandan olmamasının sebebi kapsayıcı içindeki her şeye "float" uygulamışsın ama "nav" için uygulamamışsın. Bu yüzden normal olarak sıralamıyor. Float değerini "nav" içinde uygularsan problemin çözüme kavuşur.
 
Düzeldi, teşekkürler.
 
Bu siteyi kullanmak için çerezler gereklidir. Siteyi kullanmaya devam etmek için çerezleri kabul etmelisiniz. Daha Fazlasını Öğren.…