Postingan lainnya
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
Background kepotong saat browser resize
Selamat siang gan,
Kalau saya buat background misal dengan warna merah, nah ketika browsernya dikecilin kenapa background nya jadi kepotong ikut ukuran background ya, mau nya saya tetap full.
Terima kasih,
<a href=' http://codepen.io/anon/pen/oWgWvE '> http://codepen.io/anon/pen/oWgWvE </a>
<style>
#topper{
background: red;
}
.container{
width: 1000px;
margin: auto;
}
</style>
<section id="topper">
<div class="container">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione beatae facilis dolorum cumque saepe sapiente eligendi consequatur assumenda quidem eum dolorem, velit impedit quod! Dolorum dicta ea facilis hic quasi?</p>
</div>
</section>
Saat ukuran browser normal
Saat ukuran browser dikecilin
6 Jawaban:
Coba css seperti ini, ini akan otomatis mengikuti ukuran halaman
#topper{
background-color:red;
position:relative;
width:100%;
}
.container{
width: 100%;
margin: auto;
}
itu karena class container punya rule width 1000px. bila screen dikecilkan akan kurang dari 1000px. warna merah dari #topper akan mengikuti ukuran screen sedangkan container tetap 1000px. cukup ganti
width: 1000px;
menjadi
max-width: 1000px;
jadi bila ukuran screen lebih kecil dari 1000px container akan menyesuaikan, tapi bila lebih besar dari 1000px container akan tetap 1000px
@rachmatsasongko dan @Cristal, terima kasih. Layout nya jadi responsive, saya gak mau jadi responsive, jadi ttp ada scroll bar nya.
@suhen , Oowwhhh, kalau tdk mau responsive coba ini gan
#topper,.container{
background-color:red;
position:absolute;
width:1000px;
}
Jawaban Terpilih
kalo mau tetep ada scrollnya cssnya seperti ini
#topper{
background: red;
min-width: 1000px;
}
.container{
width: 1000px;
margin: auto;
}
@Cristal dan @rachmatsasongko, terima kasih. Solved!