CSS ile logo karşısına input hizalama

ogingsan · 8 Haziran 2021

Arkadaşlar, PHP ve HTML'im iyi yalnız CSS'de zayıfım. Öğrenmeye başladım.

Yalnız, bir şeyi bir türlü yapamadım. Internette'de bir sonuca ulaşamadım örneğin bir input eklesem (sitede arama yapmak için örnek) ve bir de img ile logo eklesem, bunu CSS'de ya da HTML'de hangi kodlar ile karşı karşıya hizalayabilirim?

Margin-left, right, top denedim, bir türlü hizalayamadım logonun karşısına.

453476 · 8 Haziran 2021

Hocam float yapmanız gerek.

float => Sürekli sağ veya sola yaslamaya çalışır. Yani istediğiniz şey ortaya çıkar.

oynozan · 8 Haziran 2021

Hocam kodlar olmadan yardim edemeyiz. Logo ve input'ta display:inline-block; varsa vertical-align:middle; ekleyin.

300319 · 8 Haziran 2021

CSS:

#container{
    width:750px;
    height:350px;
    margin:10px auto;
    border:2px solid #fff;
}

.logo{
    width:350px;
    height:350px;
    background-size:100%;
    background-position:center;
    float:left;
}

.input{
    width:400px;
    height:50px;
    border:2px solid #AD1111;
    float:right;
    outline: none;
    padding:0 5px;
    margin: 20px 0;
   
}

mantion · 8 Haziran 2021

CSS'i az buçuk öğrenince Tailwind CSS framework'üne bakabilirsiniz. CSS kalmadı artık.

CSS ile logo karşısına input hizalama

Ayrıntılı düzenleme

ogingsan

Picopat

453476

Megapat

oynozan

Megapat

300319

Zettapat

mantion

Kilopat

Benzer konular