Postingan lainnya
Buku Ini Koding!
Baru!
Buku ini akan jadi teman perjalanan kamu belajar sampai dapat kerjaan di dunia programming!
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
agar konten memiliki lebar yang sama dengan gambar
 agar kontenya otomatis kebawah agar gak tabrakan gmna ya min..?sudah liat tutor tapi masih gagal aja, ini isi htmlnya
<div id="kedua">
<div class="konten">
<h2>Home</h2>
<div class="kolom">
<a href="#">
<div class="karya">
<img src="foto/gambar1.png">
<p> judul karya</p>
</div>
</a>
<p class="deskripsi">jnkjbkbkwbckbewigiewgkcbkchighriuewkbncuhreuirhiurrevrebviurgrvhvrnoerhrhrvohrleo</p>
</div>
</div>
</div>
ini css nya
.kolom{float:left; width:300px;}
.konten{
width:960px;
margin : 0 auto;
}
#kedua img{
height:200px; width:200px; margin-top: 20px;
}
8 Jawaban:
kurang paham gan sama pertanyaanya, konten (home, judul karya, dan sebagainya) bertabrakan dengan apa ya gan?
karena tag p buat textnya , ga ada di dalem div gan, kan yang dikasih lebar divnya, jadi p nya juga harus disitu
di bawah gambar bulat kan ada deskripsi,nah saya ingin agar deskripsinya itu tidak memanjang tapi,otomatis ke bawah dan ada jarak dari setiap gambar
tapi kok pas ane liat tutor kang hilman tag p di taruh di luar http://www.sekolahkoding.com/kelas/video/Mengubah-desain-menjadi-HTML-dan-CSS/4
bikin pembatas aja pake border, agar text nya kebawah auto.. width dari border nya sesuai kan dengan gambar.. maksudnya nya jarak antar gambar itu margin kah.. ?
mungkin maksutnya biar textnya jadi di tengah ya gan ? itu pake text-align:center gan kayanya . thanks.
Jawaban Terpilih
pertama-tama img di buat menjadi block lalu margin kanan kiri di buat auto, setalah itu pada kelas deskripsi buat break-word supaya teks nya kebawah.
#kedua img{
display: block;
height:200px;
width:200px;
margin-top: 20px;
margin-left: auto;
margin-right: auto;
}
.deskripsi{
word-wrap: break-word;
}
