Dan masalahnya pas tampilan webnya udah jadi, eh pas di resize malah berantakan ga karuan
gini contohnya :
SEBELUM :
SESUDAH :
Mohon pencerahannya ya mastah mastah
Kenapa yaa tampilan web saya berantakan jika di resize ?? saya pake tag div
Main Content
Kenapa yaa tampilan web saya berantakan jika di resize ?? saya pake tag divBerhubung ane udah kelas 2 di jurusan RPL, gw dikasih tugas buat bikin tampilan web
Dan masalahnya pas tampilan webnya udah jadi, eh pas di resize malah berantakan ga karuan
gini contohnya :
SEBELUM :
SESUDAH :
Mohon pencerahannya ya mastah mastah
Dan masalahnya pas tampilan webnya udah jadi, eh pas di resize malah berantakan ga karuan
gini contohnya :
SEBELUM :
SESUDAH :
Mohon pencerahannya ya mastah mastah
Script nya tampilin sini gan 
Coba pelajari tentang media-query di CSS gan. Supaya nanti tampilan nya bisa responsif 
KASKUS Ads - Create Your Ads / Buat Iklan
agan harus mulai belajar tentang desain web responsive. belajar cara bikin halaman responsif dengan css.. kalo belum tau tentang reponsif, nih baca :
Mengenal Responsive Web Design
Mengenal Responsive Web Design
Belajar responsive design gan
Ga masalah mau pake div ataupun tag lainnya, itu cuma masalah style aja gan. Sepertinya agan banyak menggunakan style position: absolute atau menggunakan float.
Abis Dari w3Schools.com lanjut sini gan
Abis belajar dari w3Schools.com di test disini gan:
http://responsivetest.net
http://responsivetest.net
Quote:
Oke thanks agan semua, kalo boleh tau tempat tutorial lengkap buat belajar web dimana yah ? selain w3school
kalo agan gak mau responsive kasih size yang statis aja
seperti
<body>
<div style="height:auto; width:1024px;margin:0px auto">
// content ..
</div>
</body>
seperti
<body>
<div style="height:auto; width:1024px;margin:0px auto">
// content ..
</div>
</body>
Quote:
Original Posted By valdyrizki►
Oke thanks agan semua, kalo boleh tau tempat tutorial lengkap buat belajar web dimana yah ? selain w3school
Oke thanks agan semua, kalo boleh tau tempat tutorial lengkap buat belajar web dimana yah ? selain w3school
kalo mau yang lain coba lihat disini gan
: 7 Situs Belajar Buat Websiteklo d kasih kaya gtu pasti nnti ga bisa tampilan mobile ya ?
Responsive Website Design Testing Tool TRY!! it now
http://freeconverts.com/include/responsive/
http://freeconverts.com/include/responsive/
Kalau mau pakai template resposive, usahakan "width" nya jangan pakai fixed, tapi pakai "persen".
Kalau widthnya fixed, ketika lebar layar kurang dari total lebar elemen, salah satu elemen bakal dipindah di bawah.
Misalnya: mau ada 2 elemen, dibikin berdampingan.
Elemen 1: lebar maksimum 200px, atau sekitar 30% dari lebar layar ketika layar di resize.
Elemen 2: lebar maksimum 600px, atau sekitar 70% dari lebar layar ketika layar di resize.
Total lebar elemen ketika layar maximized hanya 800 pixel dan ketika layar diperkecil total lebar elemen adalah 100% dari lebar layar.
Responsive CSS :
#Elemen1 {
width: 30%; <-- memastikan lebar 30% dari total lebar layar.
max-width: 200px; <-- dengan lebar elemen maksimal tidak lebih dari 200 pixel.
float: left;
}
#Elemen2 {
width: 70%; <-- memastikan lebar elemen 70% dari lebar layar (lebar elemen 1 + elemen 2 = 100% atau lebar penuh)
max-width: 600px; <-- memastikan lebar elemen maksimum tidak lebih dari 600px (lebar elemen 1 + lebar elemen 2 = 800pixel)
float: left;
}
catatan : pastikan padding kanan dan kiri 0 supaya tidak ada penambahan lebar elemen.
Kalau widthnya fixed, ketika lebar layar kurang dari total lebar elemen, salah satu elemen bakal dipindah di bawah.
Misalnya: mau ada 2 elemen, dibikin berdampingan.
Elemen 1: lebar maksimum 200px, atau sekitar 30% dari lebar layar ketika layar di resize.
Elemen 2: lebar maksimum 600px, atau sekitar 70% dari lebar layar ketika layar di resize.
Total lebar elemen ketika layar maximized hanya 800 pixel dan ketika layar diperkecil total lebar elemen adalah 100% dari lebar layar.
Responsive CSS :
#Elemen1 {
width: 30%; <-- memastikan lebar 30% dari total lebar layar.
max-width: 200px; <-- dengan lebar elemen maksimal tidak lebih dari 200 pixel.
float: left;
}
#Elemen2 {
width: 70%; <-- memastikan lebar elemen 70% dari lebar layar (lebar elemen 1 + elemen 2 = 100% atau lebar penuh)
max-width: 600px; <-- memastikan lebar elemen maksimum tidak lebih dari 600px (lebar elemen 1 + lebar elemen 2 = 800pixel)
float: left;
}
catatan : pastikan padding kanan dan kiri 0 supaya tidak ada penambahan lebar elemen.