HTML Tables -> CSS transition problems

yuppie · 06-20-2006, 02:39 PM

Initial URL: http://www.teamtesting.com (TABLES)

I decided to rewrite all the pages in my portal without tables using CSS.
Here is a draft version of the index page:
http://www.teamtesting.com/tmp/index.jsp

Now the problems:
1) A login form on the left side of the page looks differently in IE and FF. The way it looks in IE is alright, and I expect the same behaviour in FireFox, but unfortunately I got form's bottom image shifted as well as the top border of the form's top image

Any ideas on why it happens?
2) How to insert textual data/input fields into the login form without form's left and right images being shifted (as you see I use float:left and float:right for left and right border images of the form)? Could you please provide a snippet from my sources, where you add some text inside the form (inside 4 images around).
????: NamePros.com http://www.namepros.com/programming/209178-html-tables-css-transition-problems.html

P.S.: this is my first serious CSS experience, so I would appreciate if you give me some hints/guidelines, if I'm doing anything wrong.

Thank you very much,
yuppie.

Luc · 06-25-2006, 10:46 PM

Bump for you. I had similar issues with IE/FF differences. Even Opera seems to show the sites properly but FF always messes up some minor details.

Bump for someone who knows CSS well, or I might have to go out and get me a book.

Coreycyberdesig · 06-26-2006, 03:34 AM

Hmm nice design let me take a look and see if I can assist.

Dan · 06-26-2006, 04:58 AM

Code:

                    <div style="float: left; height: 151px;"><img src="form2.jpg" border=0 alt=""></div>
                    <div style="float: right; height: 151px;"><img src="form3.jpg" border=0 alt=""></div>

Make that into 1 div with a background image of what both of those would normally be.

06-20-2006, 02:39 PM	THREAD STARTER #1 (permalink)
yuppie NamePros Regular Join Date: Apr 2006 Posts: 545	HTML Tables -> CSS transition problems Initial URL: http://www.teamtesting.com (TABLES) I decided to rewrite all the pages in my portal without tables using CSS. Here is a draft version of the index page: http://www.teamtesting.com/tmp/index.jsp Now the problems: 1) A login form on the left side of the page looks differently in IE and FF. The way it looks in IE is alright, and I expect the same behaviour in FireFox, but unfortunately I got form's bottom image shifted as well as the top border of the form's top image Any ideas on why it happens? 2) How to insert textual data/input fields into the login form without form's left and right images being shifted (as you see I use float:left and float:right for left and right border images of the form)? Could you please provide a snippet from my sources, where you add some text inside the form (inside 4 images around). ????: NamePros.com http://www.namepros.com/programming/209178-html-tables-css-transition-problems.html P.S.: this is my first serious CSS experience, so I would appreciate if you give me some hints/guidelines, if I'm doing anything wrong. Thank you very much, yuppie.

06-25-2006, 10:46 PM	#2 (permalink)
Luc NamePros Member Join Date: Nov 2003 Location: Los Angeles Posts: 168	Bump for you. I had similar issues with IE/FF differences. Even Opera seems to show the sites properly but FF always messes up some minor details. Bump for someone who knows CSS well, or I might have to go out and get me a book. __________________ Looking for Type-in, Page Rank, Link Popularity, Alexa domains or Whois/Availability? Domain Research Tool Finds, Tracks and Acquires domains. Try it free.

06-26-2006, 03:34 AM	#3 (permalink)
Coreycyberdesig NamePros Member Join Date: May 2006 Posts: 39	HMM Interesting Hmm nice design let me take a look and see if I can assist.

06-26-2006, 04:58 AM	#4 (permalink)
Dan Buy my domains. Join Date: Feb 2006 Posts: 2,796	Code: <div style="float: left; height: 151px;"><img src="form2.jpg" border=0 alt=""></div> <div style="float: right; height: 151px;"><img src="form3.jpg" border=0 alt=""></div> Make that into 1 div with a background image of what both of those would normally be.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

HTML Tables -> CSS transition problems

HMM Interesting