Mobile app version of vmapp.org
Login or Join
Fox8124981

: Input content in FF & Opera i got a "register user to website" form on my site. It looks fine in all browsers except Opera and FF.. i tryed to show pics through html so you can see what

@Fox8124981

Posted in: #Firefox #UserInput

i got a "register user to website" form on my site.
It looks fine in all browsers except Opera and FF..
i tryed to show pics through html so you can see what I mean, but i cant without 10 posts, and i can only post one link, so..

here is the one pic and the explanation -> img183.imageshack.us/img183/4903/45825110.jpg
notice the vertical spacing between the input boxes...

how do I make it look the same in all the browsers?

thanks in advance for the anwsers..
Andrej

btw: i did't use any css resets on my page..

10.03% popularity Vote Up Vote Down


Login to follow query

More posts by @Fox8124981

3 Comments

Sorted by latest first Latest Oldest Best

 

@Speyer207

Just tried it out in JSFiddle and it seems to work fine.

HTML:

<form>
<fieldset>
<input />
<input />
<input />
<input />
<input />

<input id='kbr' />
<label id='kbr_label' for='kbr'>Kbr:</label>

<input />
<input />
<input />
<input />
</fieldset>
</form>​


CSS:

fieldset {
border: 1px dotted silver;
padding: 1em;
width: 10em;
}

input {
display: block;
float: right;
margin-bottom: 0.5em;
width: 100%;
}

#kbr {
width: 50%;
}

#kbr_label {
float: right;
}


EDIT:

Version 2 in JSFiddle gets rid of the last input boxes bottom margin.

10% popularity Vote Up Vote Down


 

@Cofer257

First, try using a strict doctype because it reduces cross-browser problems to almost none. At its most simplest you can put <!doctype html> as the very first thing on your page, before <html>.

Posting the HTML/CSS code would have been useful but it looks like you need to add a margin to the inputs. At its most basic adding margin: 2px 0 to your styles for those input should work a treat.

10% popularity Vote Up Vote Down


 

@Sent6035632

It's tough without seeing some code, but simple margin / padding issue like that across different browsers can often be remedied by using a browser reset in your css.

Here's an example, although if you do a google search you'll see that there are many others.
www.siolon.com/blog/browser-reset-css/

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme