Menu
Does any one know why my Safari is not taking padding in select lists? It's working fine in FF please tell me what to do. is there any issue with the doctype?
code:
<select style="padding-left:15px">
<option>male></option>
<option>female></option>
</select>
I'm using the following doctype;
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
965
You need to apply padding-left: 20px; to the ul. Add this to your css: . listing { padding-left: 20px; } .
To create space between list bullets and text in HTML, use CSS padding property. Left padding padding-left is to be added to <ul> tag list item i.e. <li> tag. Through this, padding gets added, which will create space between list bullets and text in HTML.
auto is not a valid value for padding property, the only thing you can do is take out padding: 0; from the * declaration, else simply assign padding to respective property block.
Even though the W3 spec doesn't disallow padding in select boxes, for whatever reason webkit browsers (Safari, Chrome) don't support it. Instead, you can remove the padding-left and use text-indent instead, adding the same amount to your select box width.
From your example in your comment:
<select id="sexID" name="user[sex]"
style="border:1px solid #C1272D;
width:258px; // 243 + 15px
text-indent:15px;
height:25px;
color:#808080;">
Use a combination of text-indent and line-height to create the illusion of padding. Works in Safari and Should work in IE as well.
<select style="text-indent:15px; line-height:28px;">
<option>male</option>
<option>female</option>
</select>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
