Garh! IE prob with slices lining up using form!

Okay so I have a site which uses a sliced psd as the template, and in one corner, a login form. In FF it’s working fine, but IE seems to have trouble with it. I am using css to change different values of properties. I tried setting the input boxes to a height of 10px and that fixed the problem, but then the boxes are way too small. this is what I have in the page:

<TD style="width: 163px; height: 53px; background: #E1E1E1; font-size: 10px;">
			<form name="login" method="post">
				<input type="text" name="login" class="select" style="width: 100px; height: 20px;" /><br />
				<input type="password" name="pass" class="select" style="width: 100px; height: 20px;" /><input type="submit" value="Login!" class="submit" style="padding-left: 10px;" />

this outputs this:

In ff it looks great. In IE it changes the tds height. WHY? I tried padding the form, hoping it would move it down a bit as it seems to not understand it has tons of room below the form area, yet it’s still messing it all up. Any ideas?


what is the DOCTYPE. I think that is your problem

Maybe you could post a screenshot, I just tested it in IE, Safari, and FF and they all look the same.

I changed the doctype and validated the html (changed most major problems it found there). But it’s still having problems with IE, while FF is fine. I’ll post a screen.

Oh and here is the code for that, I’ll make it more legible than before…

<td style=“width: 163px; height: 53px; background: #E1E1E1; font-size: 10px;”>
<form name=“login” action=“index.html” method=“post”>
<input type=“text” name=“login” class=“select” style=“width: 70px; height: 15px;” /><br />
<input type=“password” name=“pass” class=“select” style=“width: 70px; height: 15px;” /><input type=“submit” value=“Login!” class=“submit” style=“padding-left: 10px;” />
Hope you guys have some more ideas, thanks :slight_smile:

I would need to see the whole source to help you.

sorry, i figured so. its mostly just images. lemme attach it…
k that should do it. oh and the css file is in there too. it is pretty messy but i really just use a few items in the page. I hope you can help me cause I can’t figure this out, and now the lines are back… argh…

I think it’s the style sheet. I don’t know what’s wrong. I think I don’t know enough about css. Whenever I remove something that I think isn’t really necessary for the document it screws it up more. And each page I put up is looking more and more messed up…

what am I doing wrong, why would it do that?

Well it looks like you sliced it kind of sloppy. I’d go back to PS and get rid of those tiny slices you’ve made.

I don’t know anything about slicing. Maybe I should figure that out better, I didn’t know that had an effect much on it… but I guess it would since it sets it up as a table bah. I’ll do that yah.

Slicing can save a lot of time for complex sites but it does have its problems. One tip that will probably save you some trouble is not to make slices less than 20px in height or 4px in width.

Thanks for the help guys. I decided to reslice index.html, but still got the same results. I decided to try messing with the style sheet as when I added that it was messed up. But I realized I was also adding what DDD suggested about the doctype. When I remove the doctype it works fine. Why, and what can I do to make it work with doctype? Is it that necessary?