CSS Bilen yardım edebilirmi ?

Question

Merhaba arkadaşlar css te bir sorun yaşıyorum resimdede gördüğünüz gibi ekranı küçültüğümde menüler ve geri kalan kısımlar sol taraftaki menü barınaltına geçip kayboluyorlar bir türlü bunu sol tarafı geçmemesi için sınırlandıramadım

.middle {

width: 100%;
  display: inline-block;
  vertical-align: top;
  z-index: -10;
  position: absolute;

}
.wrapper {
  
  margin-left: 22px;
  margin-right: 22px;

}

.left {
  left:0px;
  right: auto;
  width: 250px;
  display: inline-block;
  vertical-align: top;
  border-radius: 0 0 10px 10px;
  background-color: #888888;
  position: fixed;
  box-shadow: 0px 0px 8px 0px rgba(158,160,183,0.32);

}

.right {
  
  top: 48px;
  left: 100%;
  display: inline-block;
  vertical-align: top;
  position: absolute;
  width: 280px;

}

acrbaran · Answer

sol menüyü ve sağ content i ayrı div lere alıp col-3 col-9 verebilirsin

BolkazancNET · Answer

acrbaran adlı üyeden alıntı:						mesajı görüntüle									sol menüyü ve sağ content i ayrı div lere alıp col-3 col-9 verebilirsin 		cevabınız için teşekürler hocam yanlız bootsrap uyumlu değil

Mücahit · Answer

@media only screen and (max-width: 1080px) {
  .middle {
  width: 70%;
  float:right;
  display: inline-block;
  vertical-align: top;
  z-index: -10;
  position: absolute;
}
}

Bunu ekleyip test eder misiniz?

BolkazancNET · Answer

Mücahit adlı üyeden alıntı:						mesajı görüntüle									@media only screen and (max-width: 1080px) {
.middle {
width: 70%;
float:right;
display: inline-block;
vertical-align: top;
z-index: -10;
position: absolute;
}
}

Bunu ekleyip test eder misiniz? 		Merhaba hocam media ile width i daha önce sınırlandırmıştım çalışıyor bu zaten ama her çözunurluğu eklemek lazım ve başka alanları ona göre tasarlamak gerekiyor ayrı yetten o sorunu çözdüm bu sefer ekran küçüldükçe sağ taraf dışarıya kaçıyor
.middle {
    
  width: 70%;
  display: inline-block;
  vertical-align: top;
  z-index: 10;
  position: relative;
  margin-left: 250px;
  margin-right: 15em;
}
.wrapper {
  
  margin-left: 22px;
  margin-right: 22px;

}

.left {
  left:0px;
  right: auto;
  width: 250px;
  display: inline-block;
  vertical-align: top;
  border-radius: 0 0 10px 10px;
  background-color: #888888;
  position: fixed;
  box-shadow: 0px 0px 8px 0px rgba(158,160,183,0.32);

}

.right {
  
  top: 48px;
  left:100%;
  display: inline-block;
  vertical-align: top;
  position: absolute;
  width: 280px;

}

QuarkChain · Answer

.left { position:fixed; left:0px; height:100%; width:250px }
.right { position:fixed; left:250px; height:100%; right:0 } // width olmayacak

BolkazancNET · Answer

QuarkChain adlı üyeden alıntı:						mesajı görüntüle									.left { position:fixed; left:0px; height:100%; width:250px }
.right { position:fixed; left:250px; height:100%; right:0 } // width olmayacak 		burayı unuttum sorunu çözdüm sanırım  
.middle {
    
  top: 70px;
  left: 10px; 
  right: 10px; 
  bottom: 10px;
  margin: auto; 
  min-width: 50%;
  min-height: 50%;
  display: inline-block;
  vertical-align: top;
  position: absolute;
  margin-left: 250px;
  margin-right: 280px;
  
}saçma bir css yapısı olmuş olabilir bir laf vardır çalışıyorsa kessinlikle dokun  belkide dokunmada olabilir o söz

evet hocam cevabınız için teşekkürler left ve right teki width menülere ayrılan boyuttur dediğnizi merakımdan denedim menüler kayboldu teşekkürler yinede

QuarkChain · Answer

Bir sayfada önizlemesini yapabiliyorsak eğer URL verebilirsiniz canlısını görüp müdahale daha kolay olur
___

gerçi dashboard olduğunu yeni farkettim.

BolkazancNET · Answer

QuarkChain adlı üyeden alıntı:						mesajı görüntüle									Bir sayfada önizlemesini yapabiliyorsak eğer URL verebilirsiniz canlısını görüp müdahale daha kolay olur 		localhost hocam anydesk team viewer var

BolkazancNET · Answer

QuarkChain hocam sağolsun sorunu çözmüştür arkadaşlar teşşekürler