v2.5.2
Giriş yap

İç içe geçen divleri nasıl iç içe geçmesini engellerim?

bukr3j
496 defa görüntülendi ve 1 kişi tarafından değerlendirildi
1 1 
  .lang-kutu{
  display: block;
  width: auto;
  height: auto;
  float: right;
}
.lang-menu {
    width: auto;
    text-align: left;
    font-weight: bold;
    margin-top: auto;
    float: center;
    color: #000000;
    position: relative;
    transition: all 0.3s ease;
}
.lang-menu .selected-lang {
    display: flex;   
    justify-content: space-between;
    line-height: 2;
    cursor: pointer;
}
.lang-menu .selected-lang:before {
    content: '';
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url(../img/flags/tr.png);
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: auto;
}

 .toggler{
 display: block;
 position: absolute;
 right: 0;
 width:2rem;
 height: 2rem;
 padding:0;
 background: none;
 border:0;
}

.toggler:focus{
  outline: none;
}

.toggler-icon{
  display: block;
  border-top:2px solid #000;
  margin-top: 0.5rem;
}

.toggler-icon:first-child{
  margin-top: 0;
}

İlgili css kodlarım bunlar. İkisinin display değeride block olmasına rağmen iç içe geçiyorlar.

css html
Cevap yaz
Cevaplar (1)
metehankuscu
1083 gün önce

Merhaba dostum

Öncelikle kod yazımından bahsedicek olursam bir yerde açtığın tag'i başka bir yerde tekrar tekrar açmışsın bu fazlasıyla kod kirliliğine sebep oluyor.
Bunun haricinde iç içe geçmelerinin en büyük sebebi (eğer ki divleri iç içe yazmadıysan),

position:absolute;
ve
display:flex;
özelliklerinden kaynaklanıyor.
Sana tavsiyem kod satırlarını olabildiğince az tutmaya çalış ki ileride tekrar baktığında seninde kafan karışmasın. Ve düzeltmeler yapıcagın zaman iki farklı yerde değişiklik yapmak zorunda kalma

Umarım yardımcı olabilmişimdir.
Kolay gelsin.

2
#008301