Padding Problem

[robindean]

Hello all,

I have a text input field which make use of the following css ...

input[type="text"] {
width: 185px;
height: 15px;
border: 0px;
padding: 4px 6px 4px 6px;
font-size: 12px;
font-family: verdana, arial, helvetica;
font-weight: bold;
color: #ddaa33;
background-color: transparent;
position: relative;
top: -2px;
left: -2px;
float: left;
}

For some reason, Safari and Shiira (both for mac) are displaying one extra pixel of padding that is causing me some design trouble.

Is there a missing property in my css code that could alleviate the problem for these two browsers?

[Fang]

margin ?

[robindean]

Good prospect, but no. I already have this in there (forgot to include in opening thread).

form, input {
margin: 0px;
}

Other possibilities?

[ray326]

position: relative;
top: -2px;
left: -2px;
float: left;Does that make sense?

[robindean]

if you're asking me if my own code works, it does indeed. The text input is placed slightly left and top to hide it's focus border on apple / safari.

However, the padding within the text box is what's in question. I've triple checked my math and visuals on the relative positition of the text box and all is well.

It's the padding INSIDE the text box that is confusing. Safari adds one extra pixel. I need for it not to. I'm not sure if there is property I've forgotten with a default setting of "1" or "1px", hence this thread.

The question is, am I forgetting a property in regards to the text area that would cause it to add one extra pixel of left / right sided padding in Safari and Shiira by default?

[Fang]

The line-height can alter the alignment of text within the field in some browsers.

[robindean]

I suppose I should mention that the extra pixel of padding is only on the left and right sides, not the top and bottom.

LOL

Sorry for the confusion.

Is there a version of line-height for the horizontal rule that this might affect?