อยากทราบวิธีการปรับ ขนาดความกว้าง textbox ตามชุดข้อมูลที่อยู่ด้านหน้า

[Ittichai_chupol]

1.ผมต้องการที่จะขนาด textbox ให้มีขนาดกว้างขึ้นเมื่อ ด้านหน้า textbox ไม่มีข้อความใดๆ ดังรูป

Selection_999(1678).png (45.3 KiB) Viewed 170 times

2.แต่หากมีข้อความอยู่ด้านหน้าก็ให้ลดขนาดลงมา เป็น 70 px

Selection_999(1677).png (66.3 KiB) Viewed 170 times

css ที่ใช้งานอยู่ครับ

Code: Select all

@media (max-width: 430px) {

    #page-header .search-box .inputbox {
        width: 70px;
    }

    .action-bar .search-box .inputbox ::-moz-placeholder {
        content: "Search...";
    }

    .action-bar .search-box .inputbox :-ms-input-placeholder {
        content: "Search...";
    }

    .action-bar .search-box .inputbox ::-webkit-input-placeholder {
        content: "Search...";
    }
}

[thatsawan]

ใช้วิธี สร้าง Class ใน HTML 2 ชุด ก็ได้ ว่าถ้ามีขนาด มากกว่า มือถือ ให้ใช้ show ส่วนอีกอันก็ hidden ไว้

[Ittichai_chupol]

นำไปใส่ ใน css ที่ใช้ทุกหน้า

body.section-index #keywords {
width: auto !important;
}