Re: Line Spacing between browsers - any way to make it consistent?
The root issue is this. I use Golive's layout grid, place some text that includes lists etc in a layout text box. I then place some graphic images that pop-up a lytebox window under the text box. I get things looking nice in Firefox/Safari etc then have to try to make it look good in IE.
The issue is that because these boxes are fixed, text sometimes spills over the top of the graphic buttons. Here's a page that would be affected.
<http://www.petmaniacs.com.au/Hiding/Pages/Diets/Raw/VAN/VAN.html>
I removed a list from this page to get past the problem for the moment, so please imagine a list is there. I lay the page out so the bottom graphic buttons are placed well next to the text. Check in Safari/Firefox/Opera etc and all is good. Change to IE and the text has spilled out over the buttons.
When I first started with this, my CSS didn't set any margins, line heights etc so it was a real mess. Prompted by your comments, I learned about setting default CSS values - I'm now learning about Eric Meyer's CSS Reset. So I got most of that looking good, but then came up against the lists which still were not consistent. <http://alistapart.com/articles/layeredfudge> tells me that "IE 6 leaves an equal amount of space before and after the ULs. However, later versions of Mozilla (1.7.3), Opera (7.54) and Firefox (1.0) leave space before the ULs, but none after." So - that's where I'm at now. That page may actually contain the fix for the problem - I ran out of time last night due to sleep needs!
It may be that I have to stop using the layout grid and put the graphics inline with the text. Everything I'm reading tells me to do this. I think I tried it and something wasn't right but I'll go there again after I absorb the alistapart info and anything you can contribute.
Thanks for your attention! It's appreciated!
James
|