iEntry 10th Anniversary Webforumz RegistrationAnnouncements Contact Webforumz StaffContact
Home Resources Blogs Meet the Team Contact Register
 

Go Back   WebForumz.com > The Code > HTML, XHTML and CSS
Reload this Page Firefox Vs IE7 (CSS)
Register All Albums Blogs FAQ Members List Calendar Search Today's Posts Mark Forums Read

Reply
 
LinkBack Thread Tools
Old September 18th, 2007, 06:52 AM   #1
Most Reputable Member
 

Join Date: Feb 2004
Location: Borneo
Age: 28
Posts: 1,629
Blog Entries: 2
Thanks: 0
Thanked 4 Times in 3 Posts
Rep Altering Power: 0 Monie is a jewel in the rough Monie is a jewel in the rough Monie is a jewel in the rough Monie is a jewel in the rough
Firefox Vs IE7 (CSS)
Well, what is the problem with this IE7? It makes me sick!

The code below is still under testing, which I spent a lot of time doing the testing in my firefox browser. When I tested them in IE7, the page seems totally lost! Could any of you have a look at them and teach me where to make the correction. I hope karinne will save me
Thank you.

IE7 Preview

Firefox Preview

Here is my Login.asp page:
Code:
<%
    Content = ""                            'Clear the Content string
    QStr = Request.QueryString("login")        'Save the login querystring to QStr

    Title = "MonieWeb Login"

    'The code below saves the contents the table must have in the variable Content
    'The content depends on what's in the QueryString
        
    if QStr="passfailed" then                
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><P><b><font face=Verdana color=#164376 size=2>Wrong Password nhehehe</P>Make sure that you have entered the valid <b>PASSWORD</b><BR><BR><A HREF=javascript:history.go(-1)><font face=Verdana color=#164376 size=2><b>:: Back ::</b></font></A></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br></td></tr>"
    elseif QStr="namefailed" then
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br><br></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><P><b><font face=Verdana color=#164376 size=2>Invalid Username</P>Make sure that you have entered the valid <b>USERNAME</b></font><BR><BR><A HREF=javascript:history.go(-1)><font face=Verdana color=#164376 size=2><b>:: Back ::</b></font></A></b></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br></td></tr>"
    elseif QStr="bothfailed" then        
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br><br></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><P><b><font face=Verdana color=#164376 size=2>You must supply both a username and password!</P>Make sure that you have entered the valid Username and Password</font><BR><BR><A HREF=javascript:history.go(-1)><font face=Verdana color=#164376 size=2><b>:: Back ::</b></font></A></b></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br></td></tr>"
    elseif QStr="createnew" then
        Content = Content & "<form name=frmCreate method=POST action=create.asp>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br>Username: <input type=text name=txtUsername></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center>Password: <input type=password name=txtPassword></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br>Full name: <input type=text name=txtFullname></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><input type=submit name=cmdSubmit value=Register></td></tr>"
        Content = Content & "</form>"
    elseif QStr="createnamefailed" then
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><P>Username already exist</P><A HREF=javascript:history.go(-1)>Back</A><BR><BR><A HREF=login.asp>Cancel registration</A></td></tr>"
    elseif QStr="createfullnamefailed" then
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><P>Full name already exist/P><A HREF=javascript:history.go(-1)>Back</A><BR><BR><A HREF=login.asp>Cancel registration</A></td></tr>"
    else
        Content = Content & "<form name=frmMain method=POST action=verify.asp>"

            
        'Username and Password Input text box
    
        Content = Content & "<td cellpadding=0 cellspacing=0 bordercolor=#F5F5F5 align=left><font face=Verdana color=#164376 size=1>User Name :</font></td></tr>"
        Content = Content & "<td cellpadding=0 cellspacing=0 bordercolor=#F5F5F5 align=left><input type=text name=txtUsername size=50></td></tr>"
        Content = Content & "<td cellpadding=0 cellspacing=0 bordercolor=#F5F5F5 align=left><font face=Verdana color=#164376 size=1>Password</font></td></tr>"
        Content = Content & "<td cellpadding=0 cellspacing=0 bordercolor=#F5F5F5 align=left><input type=password name=txtPassword size=50></td></tr>"
        Content = Content & "<td cellpadding=0 cellspacing=0 bordercolor=#F5F5F5 align=right><font face=Verdana color=#164376 size=1>Forgot Your Password?</font></td></tr>"
        Content = Content & "<td cellpadding=0 cellspacing=0 bordercolor=#F5F5F5 align=right></tr>"
        
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=right><input type=submit name=cmdSubmit value=Login><input type=reset name=cmdReset value=Reset_Field></font></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center></td></tr>"
        Content = Content & "</form>"
    end if
%>

 <!-- Build the page with the table -->

<head>
<title>ADMINISTRATOR LOGIN</title>
<link rel="stylesheet" type="text/css" title="default" href="css/login.css" />
</head>

<Body onLoad="this.document.frmMain.txtUsername.focus();">
    <div id="mainframe">
        <div id="header"></div>
            <div id="navigation"></div>
            <div id="title"></div>
            <div id="content">
                <fieldset id="fieldset">
                <legend><% Response.Write(Title) %></legend>
                <div id="position">
                    <table border="0" cellspacing="0" bgcolor="#F5F5F5" bordercolor="#0D5692" width="320px" bordercolorlight="#000000" bordercolordark="#000000">
                         <%
                            Response.Write(Content)    'Paste the contents in the table
                            Session("name")= "frmMain.txtUsername"
                        %>
                    </table>
                </div>
                </fieldset>
            <h1>You have to Register before you can access this page!</h1>
            </div>
            <div id="navigation"></div>
            <div id="footer"></div>
    </div>
</body>
Here is my CSS:
Code:
body {
    background-color: #E1E1E1;
    margin: 0; 
    padding: 0;
}
h2{
    margin: auto;
    height: 1.5em;
    font: small Verdana;
    font-size: 15px;
    text-align: center;
}
#mainframe {
    background-color: white; 
    margin: auto; 
    width: 886px; 
    height: auto;
}
#header {
    background-color: #3a5485;
    margin: auto;
    width: 886px; 
    height: 35px;
}
#navigation {
    background-color: #fff;
    margin: auto;
    width: 886px; 
    height: 95px;
}
#content {
    width: 550px; 
    height: auto;
    margin: auto;
    padding: 1em 0 0 0;
    border: 1px solid black;
}
#title {
    width: 550px; 
    height: 15px;
    margin: auto;
    background-color: #3A5485;
    border: 1px solid black;
    padding: 1em 0 0 0;
}
#position {
    margin: auto;
    width: 334px;
    height: 136px;
}
#footer {
    background-color: #3a5485;
    margin: auto;
    width: 886px; 
    height: 35px;
}
#fieldset {
    margin: auto;
    padding-bottom: 0;
    padding-top: 2em;
    width: 500px;
    font: small verdana;
    font-size: 10px;
    color: #000;
}
Last edited by Monie; September 18th, 2007 at 07:06 AM.. Reason: respell karinne name
Monie is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Old September 18th, 2007, 09:16 AM   #2
Elite Veteran
 

Join Date: Aug 2005
Location: That Place
Posts: 2,081
Blog Entries: 1
Thanks: 0
Thanked 37 Times in 37 Posts
Rep Altering Power: 0 moojoo will become famous soon enough moojoo will become famous soon enough
Re: Firefox Vs IE7 (CSS)
Oi, VBScript. Any reason you have margin:0 auto; on everything? I have to catch a plane but will come back to this when I can.
__________________
Last edited by moojoo; September 18th, 2007 at 09:20 AM..
moojoo is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Old September 18th, 2007, 12:41 PM   #3
WebForumz Admin Badge
 
Marc's Avatar
 

Join Date: Apr 2007
Location: Scotland, UK
Posts: 2,086
Thanks: 2
Thanked 23 Times in 23 Posts
Rep Altering Power: 85 Marc is just really nice Marc is just really nice Marc is just really nice Marc is just really nice
Re: Firefox Vs IE7 (CSS)
Following on from what moojoo said..

If you put *{margin:auto;} at the top of the CSS you dont need to repeat that again although if you do want to change the margin on anything just do it as so:
Code:
.header{margin:20px;}
Above will set EVERY margin to zero unless you change it particularly like the way i did my example.

Sorry if that makes no sense...

I think of * as global/wildcard.
__________________
Regards
Marc
Administrator - Webforumz.com

Web Design and Development Blog - Marc Fraser
Marc is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Old September 18th, 2007, 01:04 PM   #4
Elite Veteran
 

Join Date: Jan 2007
Location: You know where
Age: 32
Posts: 4,607
Thanks: 0
Thanked 0 Times in 0 Posts
Rep Altering Power: 0 karinne is a name known to all karinne is a name known to all karinne is a name known to all karinne is a name known to all karinne is a name known to all karinne is a name known to all
Re: Firefox Vs IE7 (CSS)
Quote:
Originally Posted by Marc View Post
I think of * as global/wildcard.
Pretty close

* is the universal selector

Quote:
The universal selector, written "*", matches the name of any element type. It matches any single element in the document tree.
If the universal selector is not the only component of a simple selector, the "*" may be omitted. For example:
  • *[lang=fr] and [lang=fr] are equivalent.
  • *.warning and .warning are equivalent.
  • *#myid and #myid are equivalent.
karinne is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Old September 18th, 2007, 11:30 PM   #5
Most Reputable Member
 

Join Date: Feb 2004
Location: Borneo
Age: 28
Posts: 1,629
Blog Entries: 2
Thanks: 0
Thanked 4 Times in 3 Posts
Rep Altering Power: 0 Monie is a jewel in the rough Monie is a jewel in the rough Monie is a jewel in the rough Monie is a jewel in the rough
Re: Firefox Vs IE7 (CSS)
Quote:
Originally Posted by Marc View Post
Following on from what moojoo said..

If you put *{margin:auto;} at the top of the CSS you dont need to repeat that again although if you do want to change the margin on anything just do it as so:
Code:
.header{margin:20px;}
Above will set EVERY margin to zero unless you change it particularly like the way i did my example.

Sorry if that makes no sense...

I think of * as global/wildcard.
Well, If I dont set the {margin: auto;} to the div inside the div (eg. Div A is inside div B), them the div position will be default to the left. If I set it to auto, it will be at the top center. Thats why I put the {margin: auto;} to every element that I want them to be at the top center. Any other way?

When I use the CSS in my other navigation page (different css file from the login page), it seems to be OK in Firefox and IE7. The only problem occur in my login page. Is this something to do with the asp function:

Code:
<%
    Content = ""                            'Clear the Content string
    QStr = Request.QueryString("login")        'Save the login querystring to QStr

    Title = "MonieWeb Login"

    'The code below saves the contents the table must have in the variable Content
    'The content depends on what's in the QueryString
        
    if QStr="passfailed" then                
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><P><b><font face=Verdana color=#164376 size=2>Wrong Password nhehehe</P>Make sure that you have entered the valid <b>PASSWORD</b><BR><BR><A HREF=javascript:history.go(-1)><font face=Verdana color=#164376 size=2><b>:: Back ::</b></font></A></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br></td></tr>"
    elseif QStr="namefailed" then
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br><br></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><P><b><font face=Verdana color=#164376 size=2>Invalid Username</P>Make sure that you have entered the valid <b>USERNAME</b></font><BR><BR><A HREF=javascript:history.go(-1)><font face=Verdana color=#164376 size=2><b>:: Back ::</b></font></A></b></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br></td></tr>"
    elseif QStr="bothfailed" then        
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br><br></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><P><b><font face=Verdana color=#164376 size=2>You must supply both a username and password!</P>Make sure that you have entered the valid Username and Password</font><BR><BR><A HREF=javascript:history.go(-1)><font face=Verdana color=#164376 size=2><b>:: Back ::</b></font></A></b></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br></td></tr>"
    elseif QStr="createnew" then
        Content = Content & "<form name=frmCreate method=POST action=create.asp>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br>Username: <input type=text name=txtUsername></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center>Password: <input type=password name=txtPassword></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><br>Full name: <input type=text name=txtFullname></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><input type=submit name=cmdSubmit value=Register></td></tr>"
        Content = Content & "</form>"
    elseif QStr="createnamefailed" then
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><P>Username already exist</P><A HREF=javascript:history.go(-1)>Back</A><BR><BR><A HREF=login.asp>Cancel registration</A></td></tr>"
    elseif QStr="createfullnamefailed" then
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center><P>Full name already exist/P><A HREF=javascript:history.go(-1)>Back</A><BR><BR><A HREF=login.asp>Cancel registration</A></td></tr>"
    else
        Content = Content & "<form name=frmMain method=POST action=verify.asp>"

            
        'Username and Password Input text box
    
        Content = Content & "<td cellpadding=0 cellspacing=0 bordercolor=#F5F5F5 align=left><font face=Verdana color=#164376 size=1>User Name :</font></td></tr>"
        Content = Content & "<td cellpadding=0 cellspacing=0 bordercolor=#F5F5F5 align=left><input type=text name=txtUsername size=50></td></tr>"
        Content = Content & "<td cellpadding=0 cellspacing=0 bordercolor=#F5F5F5 align=left><font face=Verdana color=#164376 size=1>Password</font></td></tr>"
        Content = Content & "<td cellpadding=0 cellspacing=0 bordercolor=#F5F5F5 align=left><input type=password name=txtPassword size=50></td></tr>"
        Content = Content & "<td cellpadding=0 cellspacing=0 bordercolor=#F5F5F5 align=right><font face=Verdana color=#164376 size=1>Forgot Your Password?</font></td></tr>"
        Content = Content & "<td cellpadding=0 cellspacing=0 bordercolor=#F5F5F5 align=right></tr>"
        
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=right><input type=submit name=cmdSubmit value=Login><input type=reset name=cmdReset value=Reset_Field></font></td></tr>"
        Content = Content & "<tr><td valign=top bordercolor=#F5F5F5 align=center></td></tr>"
        Content = Content & "</form>"
    end if
%>

<!-- Build the page with the table -->

<head>
<title>ADMINISTRATOR LOGIN</title>
<link rel="stylesheet" type="text/css" title="default" href="css/login.css" />
</head>

<Body onLoad="this.document.frmMain.txtUsername.focus();">
    <div id="mainframe">
        <div id="header"></div>
            <div id="navigation"></div>
            <div id="title"></div>
            <div id="content">
                <fieldset id="fieldset">
                <legend><% Response.Write(Title) %></legend>
                <div id="position">
                    <table border="0" cellspacing="0" bgcolor="#F5F5F5" bordercolor="#0D5692" width="320px" bordercolorlight="#000000" bordercolordark="#000000">
                      <%
                            Response.Write(Content)    'Paste the contents in the table
                            Session("name")= "frmMain.txtUsername"
                        %>
                    </table>
                </div>
                </fieldset>
            <h1>You have to Register before you can access this page!</h1>
            </div>
            <div id="navigation"></div>
            <div id="footer"></div>
    </div>
</body>
Monie is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Old September 19th, 2007, 05:01 AM   #6
Reputable Member
 

Join Date: Apr 2007
Location: Scotland
Age: 19
Posts: 233
Thanks: 0
Thanked 0 Times in 0 Posts
Rep Altering Power: 0 Blake121 will become famous soon enough
Re: Firefox Vs IE7 (CSS)
Correct me if i'm wrong but do you not just need to add this to your body style.

Code:
body{
    text-align: center;
    background-color: #E1E1E1;
    margin: 0; 
    padding: 0;
}
Then left align it for the rest of your site

Code:
#mainframe {
    text-align: left;
    background-color: white; 
    margin: auto; 
    width: 886px; 
    height: auto;
Using text-align: center; allows the margin: 0 auto; trick to work in IE. Try it out anyway.

Hope this helps.
Blake121 is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Old September 19th, 2007, 05:17 AM   #7
Most Reputable Member
 

Join Date: Feb 2004
Location: Borneo
Age: 28
Posts: 1,629
Blog Entries: 2
Thanks: 0
Thanked 4 Times in 3 Posts
Rep Altering Power: 0 Monie is a jewel in the rough Monie is a jewel in the rough Monie is a jewel in the rough Monie is a jewel in the rough
Re: Firefox Vs IE7 (CSS)
Oh... what a release....
Thank you Blake121. I'll rate your profile to 5 star!

Thank you very much. The stupid ie browser understand your language, for some reason
Last edited by Monie; September 19th, 2007 at 05:27 AM..
Monie is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Old September 19th, 2007, 09:59 AM   #8
Elite Veteran
 

Join Date: Jan 2007
Location: You know where
Age: 32
Posts: 4,607
Thanks: 0
Thanked 0 Times in 0 Posts
Rep Altering Power: 0 karinne is a name known to all karinne is a name known to all karinne is a name known to all karinne is a name known to all karinne is a name known to all karinne is a name known to all
Re: Firefox Vs IE7 (CSS)
It doesn't make sense tho .... margin: 0 auto; should work in IE7 ... adding the text-align: center; is only for IE5 and 5.5
Last edited by karinne; September 19th, 2007 at 01:27 PM.. Reason: wrong IE versions :p
karinne is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Old September 19th, 2007, 01:24 PM   #9
Reputable Member
 

Join Date: Apr 2007
Location: Scotland
Age: 19
Posts: 233
Thanks: 0
Thanked 0 Times in 0 Posts
Rep Altering Power: 0 Blake121 will become famous soon enough
Re: Firefox Vs IE7 (CSS)
Good to see I speak IE7 lol.


I don't understand it either to be honest.

It's worked for me in the past though.

I think it's just IE being as stupid like normal.
Blake121 is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Old September 19th, 2007, 11:37 PM   #10
Most Reputable Member
 

Join Date: Feb 2004
Location: Borneo
Age: 28
Posts: 1,629
Blog Entries: 2
Thanks: 0
Thanked 4 Times in 3 Posts
Rep Altering Power: 0 Monie is a jewel in the rough Monie is a jewel in the rough Monie is a jewel in the rough Monie is a jewel in the rough
Re: Firefox Vs IE7 (CSS)
Quote:
Originally Posted by karinne View Post
It doesn't make sense tho .... margin: 0 auto; should work in IE7 ... adding the text-align: center; is only for IE5 and 5.5
yeah, I did not make sense to me neither. As if I treating the DIV as a text now. Anyway, I found out another way to center the div using
Code:
#centerDiv{
position: absolute
left: 20%
}
provided that your #container=80% wide.

Quote:
Originally Posted by Blake121 View Post
Good to see I speak IE7 lol.


I don't understand it either to be honest.

It's worked for me in the past though.

I think it's just IE being as stupid like normal.
I agree with you Blake121,
Monie is offline  
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Reply

Bookmarks

« Floats don't effect the height of the their container????? | Centering my site »

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

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
CSS & Firefox Daniel HTML, XHTML and CSS 7 April 3rd, 2007 11:01 AM
Useful Firefox Add-ons Antwan The Café 19 February 21st, 2007 01:02 PM
alt tag in Firefox afuller HTML, XHTML and CSS 8 December 9th, 2006 04:16 PM
Need help regarding firefox vs. ie james@thecultureofme HTML, XHTML and CSS 5 June 2nd, 2006 11:32 AM
IE ok, Firefox no way lizarddoctor HTML, XHTML and CSS 4 November 27th, 2005 08:35 PM

WebForumz.com is an iEntry Network® publication - 1998-2009 All Rights Reserved Privacy Policy and Legal
Contact Us - Web Design and Web Development forums for Beginners to Advanced - Archive - Top

Search Engine Optimization by vBSEO 3.2.0 RC8