bantuan.kaskus.co.id - Text box is too wide

[cipriansv]

URL: https://bantuan.kaskus.co.id/hc/id/requests/new

Browser / Version: Firefox Nightly 67.0a1 (2019-02-12) Operating System: Windows 10 Pro Tested Another Browser: Yes

Problem type: Design is broken Description: Text box is too wide Steps to Reproduce:

1. Navigate to https://bantuan.kaskus.co.id/hc/id/requests/new
2. Reach the "Subjeck" text box.
3. Observe the length of the text box.

Expected Behavior: All the text boxes must have the same length.

Actual Behavior: The "Subjek" text box length exceeds all the other text boxes.

Notes:

1. The issue is not reproducible on Chrome 72.0.3626.96
2. Screenshot attached.

Affected area:

<input type="text" name="request[subject]" id="request_subject" maxlength="150" size="150" aria-required="true">

Watchers: @softvision-oana-arbuzov @softvision-sergiulogigan @cipriansv

sv;

Browser Configuration

• None

From webcompat.com with ❤️

[wisniewskit]

This is caused by the input having size="150", which is making it wider than its flexbox parent, despite it having width:100% and flex:0 0 80%. I'm not 100% sure if that's expected behavior or not, so I've filed bz1527982 to confirm. However, the site can fix this by telling the input to have a max-size:80%:

.form-field input {
    max-width: 80%;
}

[reinhart1010]

Hey @wisniewskit you can contact the site via the reported URL. In other words, the reported webpage is the contact form for the site owner.

[wisniewskit]

Thanks! I've marked this as contactready accordingly.

[haseebgit]

Reached out via website contact page https://bantuan.kaskus.co.id/hc/id/requests/new

[nurulakbar]

hi thank you for reporting to us,

however, I decided to target the input id and remove the size attribute by using jquery since i am not really sure to solve it using css

[softvision-oana-arbuzov]

The issue has been fixed. Thanks @nurulakbar.

Tested with: Browser / Version: Firefox Nightly 71.0a1 (2019-09-10) Operating System: Windows 10 Pro

[lock[bot]]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue at https://webcompat.com/issues/new if you are experiencing a similar problem.