Tahun baru, skill baru! 🚀. Masukkan kupon "skill2025" untuk diskon 30% di kelas apa saja

Tidak bisa menampilkan box berdampingan dengan box lainnya.

Saya sudah menambahkan kodingan display : inline-block pada css di id box article dan id box side, bahkan saya sudah mengecilkan ukuran box keduanya tapi hasilnya masih atas bawah.

<!DOCTYPE html> <html lang="id"> <head> <meta charset="UTF-8"> <title> Layout Elemen dan Box </title> </head> <style>

, / selector universal untuk mengatur margin dan padding default 0 */ html { margin: 0; padding: 0; } #boxj { background-color: blue; width: 1280px; height: 100px; text-align: center; color: white;

}

#boxarticle { background-color: yellow; width: 90px; height: 90px; border-color: green; border-style: solid; border-width: 4px; overflow-y: scroll; display: inline-block; vertical-align: top; margin-top: 5px;

}

#boxside { background-color: orange; width: 90px; height: 90px; border-color: gold; border-style: solid; border-width: 4px; display: inline-block; vertical-align: top; overflow-y: scroll; margin-top: 10px; justify-content: center; }

#footer { background-color: darkgray; margin-top: 10px; } </style> <body> <main> <div> <header> <h1 id="boxj"> Jasa sewa laptop kantor, perusahaan, dan event </h1> </div> </header>

<article> <div id="boxarticle"> <h1> Inilah daftar perlengkapan event yang wajib ada, Catat </h1> <p> Menyelenggarakan suatu event tentunya mengharuskan anda menyiapkan banyak hal. Saat berbicara tentang penyelenggaraan event, tentunya penting untuk memiliki manajemen operasional yang baik. Jika tidak, event tidak akan berjalan mulus seperti yang diharapkan </p> <p> Oleh karena itu, persiapan yang matang harus dilakukan agar setiap aspek acara bisa berjalan sesuai rencana. Berikut ini adalah daftar perlengkapan event yang harus anda persiapkan jauh-jauh hari demi kelancaran event perusahaan. </p> <ol> <li> laptop atau komputer </li> <li> tenda dan kanopi </li> <li> proyektor dan layar </li> <li> meja dan kursi </li> <li> sound dan lighting </li> <li> radio walkie talkie </li> <li> dekorasi dan backdrop </li> <li> peralatan keamanan </li> </ol> </div> </article>

<aside> <div id="boxside">

&lt;h3&gt; Satu Solusi Untuk Semua Kebutuhan IT &lt;/h3&gt;
&lt;p&gt; Akses ke layanan dan perangkat IT lebih mudah dan aman bersama Erwin. Tanpa biaya tambahan dan tanpa minimum sewa. &lt;/p&gt;
&lt;a href=&quot;login facebook.html&quot;&gt; Minta Penawaran &lt;/a&gt;

</aside> </main> <div id="footer"> <footer> &copy; 2025 EWP. Dibuat di Jakarta 😁 </footer> </div>

</body> </html>

avatar erwinputra
@erwinputra

3 Kontribusi 0 Poin

Dipost 9 jam yang lalu

Belum ada Jawaban. Jadi yang pertama Jawaban

Login untuk ikut Jawaban