How to position a form

HTML & CSS
1

http://gameinfiniti.com/

I just want to move the searchbox up and away from the right a little, already tried negative margins, they dont work!

CSS:

#searchbox  {
        background: url(http://gameinfiniti.com/images/searchbox.png) 0 0 no-repeat;
        width: 201px;
        height: 31px;
        text-indent: 8px;
        float:right; }

:nono:

Thanks…

2

Hi, the outer parent needs the float first, not the child :). Floating to have an element sit next to another only works if the parent has the float, not a child.

#livesearch{float:right;}

However, since an anchor comes before the form, to make things easier (and more cross browser friendly) place the float first and have teh anchor second

<div id="top-bar">
<form id="livesearch" action="/search/" method="post" [B][I][U]style="float: right;"[/U][/I][/B]>
 <input type="text" onclick="this.value=''" id="searchbox" value="Games..." name="q">
</form>
[B]
<a id="styleswitch" href="#">New Look {Beta}</a>[/B]
</div>

Inline style above there just so you can see :wink:

3

O_o u got the source, lol anyway thanks

but i still cant make the right margin

4

Setting a right margin on #livesearch should work just fine :). Update hte source with the right margin and it will work…if it doesn’t I’ll point out what went wrong :slight_smile:

5

surprisingly it does not work? maybe add position:aboslute;
?

6

Hi, you just do right:-10px which isn’t a margin value. It’s an offset value only applied to elements with a position (relative/fixed/absolute)

Making it margin-right would work (don’t use offsets in this case)

7

ouch how dumb of me

thanks =D

8

Glad it worked :). You’re welcome.

9

one more question, lol

for the text area can u limit the number of characters that can be typed purely with css? thanks