Old 18-05-2005, 17:32   #1 (permalink)
fanmap81
Registered User
 
Join Date: May 2005
Posts: 2
Cross Browser Conformity

Ok heres the thing.....I have my sites looking the way I want them to by way of netscape.....thats the only browser thats rendering my layouts exactly how i intended. Safari,Firefox, and Opera are a little bit off......Internet Explorer 5 for Mac way off, and slightly off for Explorer on PC. Im using floats for my content. Can anybody tell me what extra CSS or code i would have to type in to make my sites very consistent across all these browsers?

http://www.fantasticfantasymm.com/WorldEquity

http://www.fantasticfantasymm.com/MMS

http://www.fantasticfantasymm.com/BKBrokers

Those are the sites. Any and all help is appreciated. Thanks
  Reply With Quote
Old 19-05-2005, 02:27   #2 (permalink)
emil
dt immigrant
 
emil's Avatar
 
Join Date: Nov 2004
Location: Bucharest - Romania
Posts: 6,952
Send a message via ICQ to emil Send a message via MSN to emil Send a message via Yahoo to emil Send a message via Skype™ to emil
I think you should first change your doctype to strict.
You have way too many divs
Quote:
<div class="HomeButton"></div>

<div><a href="index.html" class="HomeButton"></a></div>
<div class="AboutUsButton"></div>
<div><a href="AboutUs.html" class="AboutUsButton"></a></div>
<div class="StaffButton"></div>
<div><a href="Staff.html" class="StaffButton"></a></div>
<div class="ServicesButton"></div>
<div><a href="Services.html" class="ServicesButton"></a></div>
<div class="ContactButton"></div>
<div><a href="ContactUs.html" class="ContactButton"></a></div>
learn to do that with lists from here
www.css.maxdesign.com.au
This site has also good tutorilas on floating
stuff arond.
You might want to check
http://positioniseverything.net/
to clear floats and see known browser bugs.

Finally, to have things centred in the page,
you need to put everything in a container div
like so:
Code:
<div id="container"> <div id="nav"></div> <div id="content"></div> </div>
then set up your css like this
Code:
body {text-align:center;} div {text-align:justified} #container {margin:auto;}


Cheers
  Reply With Quote
Old 19-05-2005, 02:31   #3 (permalink)
emil
dt immigrant
 
emil's Avatar
 
Join Date: Nov 2004
Location: Bucharest - Romania
Posts: 6,952
Send a message via ICQ to emil Send a message via MSN to emil Send a message via Yahoo to emil Send a message via Skype™ to emil
Oh, one more thing...
waaay too much coding here imho

Quote:
.ContentBlock1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
text-align: justify;
overflow: visible;
width: 615px;
float: left;
background-image: url(images/RepeatingDivider.jpg);
background-repeat: repeat-y;
color: #000000;
padding: 0px;
background-position: left;
background-attachment: scroll;
margin: 0px;
}
.ContentBlock2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
color: #000000;
overflow: visible;
text-align: justify;
background-image: url(images/LatestNews.jpg);
background-repeat: no-repeat;
width: 150px;
float: right;
padding-top: 40px;
padding-left: 5px;
margin-right: 10px;
}
.ContentBlockWide{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
color: #000000;
overflow: visible;
text-align: justify;
width: 800px;
padding: 0px;
}

just declare once the font attributes for the paragraphs,
don't repeat them, it makes no sense
  Reply With Quote
Old 19-05-2005, 05:12   #4 (permalink)
fanmap81
Registered User
 
Join Date: May 2005
Posts: 2
will doing these things fix all my problems? are is it just a path to set me on? Not able to try right now. Thanks
  Reply With Quote
Old 19-05-2005, 05:50   #5 (permalink)
emil
dt immigrant
 
emil's Avatar
 
Join Date: Nov 2004
Location: Bucharest - Romania
Posts: 6,952
Send a message via ICQ to emil Send a message via MSN to emil Send a message via Yahoo to emil Send a message via Skype™ to emil
more like a path I only tested your sites in FF 1.0.4 and IE 6 on PC,
I can not say anything about Mac browsers, though.
Just do some reading on the links I gave you,
also check
http://www.kevinleitch.co.uk/projectnew/index.php
www.alistapart.com
www.mezzoblue.com

for further reference.
  Reply With Quote
Old 19-05-2005, 06:12   #6 (permalink)
Limbo
Baskin'
 
Join Date: Feb 2005
Posts: 5,560
Quote:
Originally Posted by emilpaun
Code:
<div id="container"> <div id="nav"></div> <div id="content"></div> </div>
then set up your css like this
Code:
body {text-align:center;} div {text-align:justified} #container {margin:auto;}

I can't get that to work in FF? Must be doing something wrong??

I use:
CSS
Code:
html, body { padding: 0; margin: 0; text-align: center; } div#wrapper { background-color: #eee; width: 500px; margin: 0 auto; text-align: left; }
html
Code:
<div id="wrapper"> <div id="content"></div> </div>

Emil - you sure you posted the correct CSS?
  Reply With Quote
Old 19-05-2005, 06:25   #7 (permalink)
emil
dt immigrant
 
emil's Avatar
 
Join Date: Nov 2004
Location: Bucharest - Romania
Posts: 6,952
Send a message via ICQ to emil Send a message via MSN to emil Send a message via Yahoo to emil Send a message via Skype™ to emil

Last edited by emil : 22-05-2005 at 06:51.
  Reply With Quote
Old 19-05-2005, 08:48   #8 (permalink)
nakedintruder
www.nakedintruder.com
 
nakedintruder's Avatar
 
Join Date: Jan 2005
Location: Leeds, Yorkshire
Posts: 383
Send a message via MSN to nakedintruder
www.dithered.com is a must have site to help with this, have a look
  Reply With Quote
Old 19-05-2005, 09:28   #9 (permalink)
Limbo
Baskin'
 
Join Date: Feb 2005
Posts: 5,560
Niceone emil - I made a typo - apologies
  Reply With Quote
Old 19-05-2005, 09:37   #10 (permalink)
emil
dt immigrant
 
emil's Avatar
 
Join Date: Nov 2004
Location: Bucharest - Romania
Posts: 6,952
Send a message via ICQ to emil Send a message via MSN to emil Send a message via Yahoo to emil Send a message via Skype™ to emil
  Reply With Quote
Reply



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

Advanced Search


Contact Us - Web Design Forums - Archive - Top
Search Engine Optimization by vBSEO 3.0.0 RC8