PDA

View Full Version : Browsers compatibility


Ronald Williams
03-21-2010, 11:26 PM
Hello,



This is the first time I use this Forum. I use Dreamweaver CS4, my website is www.salesattitude.co.uk on the page Tips on sales attitude, the big DIV (the one that starts with, “There is more to life than work”) showed well in IE8 and Safari 4.0 OS X but on Firefox 3.5 for Windows XP and Chrome 3.0 the big box had very little space at the bottom and in Firefox 3.5 OS X the text overflowed.


I made a couple of changes, I changed the overflow setting in the CSS rule Definition to auto, and it now looks better. Is there another way to do it? This happens to me all the time, I want my website to look perfect.






I’m new to CSS and I don’t know how to fix this, is it to do with the settings Padding or Margin? What can I do to make sure that it shows well in all the modern browsers?


Dreamweaver has got a tool called browser compatibility, I tried it but it doesn’t tell me what to do. When I checked the page for browser compatibility it said that there were 3 errors in the Spry menu href=”SpryAssets/SpryMenu/BarVertical.css .




Thanks for your help,

Ronald

domedia
03-22-2010, 01:19 AM
Try not to set height on your containers, and you'll see that they will grow with the content, thus no need to set the overflow property at all.

Corrosive
03-22-2010, 07:47 AM
OK, you have three real issues there. One, as Domedia says, doen't put heights on divs with text in. Let the text dictate the height. Two, you are using absolute positioning on your divs (layers/apdivs) these will start to overlap if you let them. You need to create the structure of your page from relative divs and floats for the columns; http://corrosiveonline.co.uk/tutorials_css_floats_for_layout.php. Lastly all your CSS styles are in your head tags. Put these in a separate stylesheet and link that into your page so you can reuse styles and layout on different pages.

Hope some of that helps your browser issues :)