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%!
membuat layout berjajar
cara membuat 3 layour berjajar bagaimana yaa ,,?? saya gunakan properti
float:left;
tapi tulisan dibawahnya jadi berantakan letaknya seperti ini 
ini script htmlnya
<div class"pp-embed">[pano file="http://localhost/3dri/wp-content/uploads/PANO_1/index.html" preview="http://localhost/3dri/wp-content/uploads/PANO_1/THUMB.jpg" width="400" height="400"]</div>
<h3> text di bawahnya</h3>
<div class"pp-embed">[pano file="http://localhost/3dri/wp-content/uploads/PANO_1/index.html" preview="http://localhost/3dri/wp-content/uploads/PANO_1/THUMB.jpg" width="400" height="400"]</div>
<h3> text di bawahnya</h3>
<div class"pp-embed">[pano file="http://localhost/3dri/wp-content/uploads/PANO_1/index.html" preview="http://localhost/3dri/wp-content/uploads/PANO_1/THUMB.jpg" width="400" height="400"]</div>
<h3> text di bawahnya</h3>
<div class"pp-embed">[pano file="http://localhost/3dri/wp-content/uploads/PANO_1/index.html" preview="http://localhost/3dri/wp-content/uploads/PANO_1/THUMB.jpg" width="400" height="400"]</div>
<h3> text di bawahnya</h3>
ini css yang saya pakai
.pp-embed{
margin:2px;
float:left;
}
0
4 Jawaban:
coba kasih ini gan
.pp-embed{
margin:2px;
float:left;
box-sizing:border-box;
}
0
@ahmadhanaf trimakasih gan,, tetep tidak bisa rapih ehehehe
0
Cobain nih.
<style>
* {
box-sizing: border-box;
/*ini penting gan cari digoogle fungsinya apa*/
}
/*butuh container untuk membungkus pp-embed biar rapi*/
.container {
width: 1000px;
padding: 15px;
margin: auto;
}
.container::before {
content: " ";
display: table;
}
.container::after {
content: " ";
display: table;
clear: both;
}
.pp-embed {
display: block;
float: left;
padding: 0 15px;
}
</style>
<div class="container">
<div class="pp-embed">[pano file="http://localhost/3dri/wp-content/uploads/PANO_1/index.html" preview="http://localhost/3dri/wp-content/uploads/PANO_1/THUMB.jpg" width="400" height="400"]</div>
<h3> text di bawahnya</h3>
<div class="pp-embed">[pano file="http://localhost/3dri/wp-content/uploads/PANO_1/index.html" preview="http://localhost/3dri/wp-content/uploads/PANO_1/THUMB.jpg" width="400" height="400"]</div>
<h3> text di bawahnya</h3>
<div class="pp-embed">[pano file="http://localhost/3dri/wp-content/uploads/PANO_1/index.html" preview="http://localhost/3dri/wp-content/uploads/PANO_1/THUMB.jpg" width="400" height="400"]</div>
<h3> text di bawahnya</h3>
<div class="pp-embed">[pano file="http://localhost/3dri/wp-content/uploads/PANO_1/index.html" preview="http://localhost/3dri/wp-content/uploads/PANO_1/THUMB.jpg" width="400" height="400"]</div>
<h3> text di bawahnya</h3>
</div>
0
coba tambahkan "display:inline-block" di bagian css
.pp-embed{
margin:2px;
float:left;
display:inline-block;
}
0
