Mike Soultanian wrote:
> I am having some trouble trying to figure out where some gaps are
> coming from. If you look at the following page in FF/IE/Opera,
> you'll notice that there's a gap between each of the letters in the
> big "THE ARTS" graphics with the purple background.
>
> http://admiral.its.csulb.edu/cota/index.cfm?fuseaction=cota.home
Problem: images are 'inline' by default in 'XHTML 1.0 Transitional', and
always in IE/win - creating gaps. Changing that to 'block' will break
the lineup.
Solution: float those letter-images, and clear underneath to make the
rest line up.
Try adding all of the following styles, and see if that's close enough:
#column3 {_height: 0; zoom: 1; display: table-cell;}
...which will isolate that column so a clear can be used.
'display: table-cell' is for the good browsers. '_height: 0; zoom: 1;'
make several generations of IE/win behave similarly[1].
#acrostic img {float: left;}
...which will line up letter-images without any gaps.
#acrosticsayings {clear: left;}
...to line up the rest below those letter-images.
------------------
Several other problems in there, which those W3C validators should be
able to point out.
regards
Georg
[1]http://www.satzansatz.de/cssd/onhavinglayout.html
--
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
