Avatar for Username

Sök i support

Akta dig för supportbedrägerier: Vi kommer aldrig att be dig att ringa eller skicka ett sms till ett telefonnummer eller dela personlig information. Rapportera misstänkt aktivitet med alternativet "Rapportera missbruk".

Läs mer

Denna tråd har arkiverats. Ställ en ny fråga om du behöver hjälp.

input placeholder text and box-sizing: border-box

  • 2 svar
  • 1 har detta problem
  • 18 visningar
  • Senaste svar av jacobdubail

jacobdubail
jacobdubail
more options

Hey guys,

I'm on a mac (10.9.3) running FireFox 30.

I have the old * { box-sizing: border-box; } trick implemented on my page. When doing so, my input placeholder text doesn't appear, but does in Chrome and Safari.

When I override the box-sizing on the input to content-box, the placeholder text appears.

I probably shouldn't share the url, but here you go: http://bluescape.jacobdubail.com/ Click the Search link in the nav to display the input.

Thanks, Jacob

Hey guys, I'm on a mac (10.9.3) running FireFox 30. I have the old * { box-sizing: border-box; } trick implemented on my page. When doing so, my input placeholder text doesn't appear, but does in Chrome and Safari. When I override the box-sizing on the input to content-box, the placeholder text appears. I probably shouldn't share the url, but here you go: http://bluescape.jacobdubail.com/ Click the Search link in the nav to display the input. Thanks, Jacob

Vald lösning

That input has a starting rule of height:0px.

When you click the search button, the height remains zero with box-sizing:border-box but becomes 20px with box-sizing:content-box.

Is that because zero height is not allowed with content-box or because the script does something different in the two cases? Hmm...

Läs svaret i sitt sammanhang 👍 1

Alla svar (2)

jscher2000 - Support Volunteer
jscher2000 - Support Volunteer
  • Top 10 Contributor
more options

Vald lösning

That input has a starting rule of height:0px.

When you click the search button, the height remains zero with box-sizing:border-box but becomes 20px with box-sizing:content-box.

Is that because zero height is not allowed with content-box or because the script does something different in the two cases? Hmm...

jacobdubail
jacobdubail Frågans ägare
more options

Thanks jscher2000!

I was being daft. The padding and height: 20px was working in Chrome so didn't even think it could be an issue anywhere else ;) Set it to height: auto and tweaked the padding to match the desired spacing. Everything works great again and box-sizing wasn't the problem, I was.

-Jacob