แก้ปัญหา เบื้องต้นในกรณีที่ ใส่ class="btn" แล้วปุ่มไม่แสดง

[Patipat]

ในการทำปุ่ม กด ให้มีความสวยงามนั้น ก็จะไม่พ้นเรื่องCSSเลยครับ แต่ว่า ปุ่มที่เราทำนั้นอาจจะกำหนดด้วย class ของ bootstrap ต่าง ๆหรือว่า กำหนดด้วย css ตัวเอง แต่ในบทความนี้ผมได้ทำ Override Template มาหนึ่ง Template นะครับ แล้วจะทำปุ่ม btn (button) โดยกำหนดคลาสจาก bootstrap ครับ โดยเราแค่ใส่คลาส
เช่น เราทำปุ่ม <span class="btn btn-pramary"> ปุ่ม </span> ก็จะได้ปุ่ม Primary มาหนึ่งปุ่มแล้วนะครับ แต่ว่าผมได้เจอปัญหาก็คือ ใส่ class="btn btn-primaty" ไปแล้วปุ่มไม่ขึ้นเลยครับ ก็เลยอยากจะแชร์ความรู้ อาจจะเป็นแนวทางในการแก้ไขปัญหาหนึ่งก็ได้ครับ

พอผมใส่ class ในปุ่ม Delete ครับ โดยที่ยังไม่ได้แก้บัค ก็จะไม่ขึ้นภาพ ครับ

โค้ด: เลือกทั้งหมด

<a class="button-img" href = "<?php print $prod['remove_to_cart'] ?>" onclick="document.updateCart.submit(<?php print _MZC_REMOVE_TO_CART; ?>);">
                        <center>  
                            <span style="font-size: 15px" class="btn btn-primary"> // class ที่ใส่ไปนะครับ class="btn btn-primary"
                             <i class="fa fa-shopping-cart" aria-hidden="true"></i>
                             </span>
                         </center>
                </a>

Selection_999(581).png (51.21 KiB) Viewed 1077 times

ใช้เครื่องมือ Inspector ของ Firefox หรือ Google Chrome เพื่อดูว่า ทำไมปุ่มไม่ขึ้น แล้วเราก็เจอครับ ว่า display ของ class ที่แสดงเป็น none อยู่

Selection_999(583).png (75.53 KiB) Viewed 1077 times

หลังจากนั้นให้เราเปลี่ยน display:none; เป็น display:-webkit-inline-box; เท่านี้ปุ่มก็ขึ้นแล้วครับ

Selection_999(584).png (88.37 KiB) Viewed 1077 times