[RESOLVED] Float issues
Hi (or however one starts these things),
I've been trying to 'style' the input (text) tags in an HTML form.
This has been successful by doing the following:
<input class='input_styled' type='text' />
...This works, by the way.
background:url(/library/images/input_middle.png) repeat-x top left;
background: url(/library/images/input_left.png) no-repeat 0px 0px;
background: url(/library/images/input_right.png) no-repeat top right;
When I remove the "float:left" property from the parent <span> tag, I can no longer see its background image anymore, which makes the whole effect pointless. I don't understand why it does this because it still has the padding-left value, which should (surely!) push the <input> element 5px to the right and make the thing visible again, no?
Any help would be much appreciated.
I appear to have fixed it by removing the width and height attributes. I assume having width & height as "auto" it made it the right width to contain the input and anchor tags.
I don't know why the left padding wasn't working but it seems that everything is now solved.