Custom Css Drupal Bootstrap Tidak Bekerja Di Layar Lain

Custom CSS Drupal Bootstrap Tidak Bekerja Di Layar Lain,  itulah judul yang saya tuliskan dalam pertanyaan di lembaga Drupal Indonesia, bekerjsama ini ialah kisah yang konyol, saya yakin bahwa saya mengerti ihwal media query, namun pada waktu itu alasannya ialah kurang teliti maka balasannya ada beberapa custom style yang tidak berjalan pada dikala dilihat dilayar lain, khususnya di layar - layar jenis laptop. Masalah ini hingga membuat saya pusing, alasannya ialah rencananya projek tersebut mau saya pasarkan, namun gara - gara hal ini

Baca : Teknik cepatdangampang membuat Website Cantik melaluiataubersamaini Drupal & Bootstrap

Beginilah pertanyaan saya di komunitas Drupal Indonesia

[ASK] [SHARE] [CURHAT] 

Custom CSS Drupal Bootstrap Tidak Bekerja Di Layar Lain

Saya tidak paham terkena jenis – jenis layar, dan bagaiman menuliskan judul yang sempurna untuk kasus yang saya alami. Saya masih baru, dan perlu banyak belajar, sekalian itung – itung, share + curhat, siapa tahu ada yang pernah mengalaminya…. heheh

Saya melaksanakan konfigurasi situs Drupal saya pada komputer 1, konfigurasi tersebut termasuk custom style (style.css). Disini Saya memakai template Bootstrap dan dibentuk subtheme-nya. Saya sedikit menambahkan custom style nya, dan tiruananya sudah selesai dan tampil dikomputer 1 sesuai dengan harapan

Sesudah tiruananya selesai saya coba pindahkan projek tersebut ke laptop (2), dan dikala ditampilkan di laptop, custom style yang sudah saya buat sebelumnya TIDAK BEKERJA sama sekali, alias tidak mereplace, NAMUN, dikala di layar 2 (dua) browser di laptop diperkecil ke skala tertentu custom style (style.css) saya eksklusif bekerja, tampilannya sesuai dengan layar 1 (satu), tapi ketika di full screen, style.css tidak bekerja lagi dan tampilan tidak sesuai harapan.

Saya tidak paham mengapa pada layar 1, tiruananya baik – baik saja, namun pas di test di layar 2 (laptop) custom style bermasalah. Saya tidak tahu apa penyebabnya, dan bagimana mengatasinya.

misal sederhana, saya buat custom style untuk warna tautan pada view artikel, dikala dilayar 1, custom style tersebut bekerja sesuai harapan, namun pada layar 2, seolah – olah custom tersebut tidak bekerja, kecuali layar browser di perkceil ke skala tertentu, custom style eksklusif aktif. 

/** Custom Artikel Node*/
.node-type-article .field-items img {margin:20px auto;}
.node-type-article .media-body h4 a {font-size: 15px; color: #222;}
.node-type-article .media-body a:hover {text-decoration: none; color: #337ab7;}
.page-artikel .media-body a {text-decoration: none; color: #222;}
.page-artikel .media-body a:hover{text-decoration: none; color: #337ab7;}

Kalau saya perhatikan (inspect element) saya lihat menyerupai ada arahan token dibelakang style yang saya buat, namun saya tidak tahu apakah ini kuat atau tidak ? . Lalu juga saya berpikir apakah ini harus pake media query atau apa ? alasannya ialah jikalau berdasarkan ajaran aku, seharusnya custom style saya harus diakses pertama kali sebelum style yang lain, selain itu di layar 2 custom style otomatis aktif jikalau layar di browser di perkecil dalam skala tertentu.

Saya berpikir untuk membuat ulang dari awal dan mencobanya di laptop, tapi saya pikir itu merepotkan, lagi pula saya penamasukan dengan persoalan ini, ada banyak hal yang tidak saya paham sehingga saya menuliskannya disini, simpel – gampangan sanggup solusi untuk bagaimana mengatasinya, apa perlu bikin custom style lagi, dan menciptakannya di laptop, atau bagaimana ?

--------selesai

Beberapa mitra di komunitas drupal banyak yang menanggapi pertanyaan saya ini, mereka mempersembahkan jawabanan yang bagus, namun waktu itu saya masih belum sanggup menyadari kesalahan yang saya buat, hingga akhirnya, ada seorang mitra drupal yang berkomentar dengan mempersembahkan rekaman video dari persoalan yang saya alami, direkaman video tersebut saya melihat ada media query yang aktif, padahal saya tidak pernah mendefinisikan media query untuk custom link yang saya buat, dan setelah diperiksa ternyata ada media query pada custom slide carousel yang saya buat yang LUPA DITUTUP, sehingga mempengaruhi custom style yang lain yang seharusnya tidak memakai media query, malah ikut terkena imbas dari media query alasannya ialah lupa mempersembahkan tag epilog pada media query, yaitu pada bagian 

@media screen and (max-width: 1090px){
.title-carousel-custom{ font-size: 24px;}

Baca : Mengatasi Carousel Module Views Bootstrap yang Kurang Responsif

Hal tersebut membuat tiruana custom style yang saya buat ketika diakses dilayar jenis laptop pada dikala full screen menjadi tidak aktif. 

Masalahnya memang sederhana dan sangat konyol, tiruananya gara - gara saya lupa nutup media query untuk slide carousel yang saya buat.

Thanks Komounitas Drupal Indonesia : Khalid Bin Walid, Pri Yan To, Pawn Prince

Share :