For some reason there are some strange gaps between my divs that no matter what I do I cannot correct. The URL is as follows:
For an example of the strange gaps I am referring to, please see the space between the "Results from 2011 Survey on Regional Extension Centers" item and "Centering on the Patient: How Electronic Health Records Enable Care Coordination" item. It occurs elsewhere on the page as well.
I was wondering if maybe giving the divs a fixed height would work but I tried that via firebug and it doesn't seem to do anything.
Thank you in advance!
Hi ehealth, You would find
You would find giving each of the divs a class and styling them in a stylesheet much easier to manage.
Have a close look and you will see that the top of the divs under the gaps line up with the bottom of the div on the right.
If you think about how floats work and that is sort of expected behavior.
Giving them a set height should help, and set overflow to hidden.
A couple of other things to try:
Play around with clear values, try clear:left; on the left divs and clear:right; on the right.
Remove the pixel margin value, mixing % with pixels is always difficult.
Hey Tony, Thanks a bunch. I
Thanks a bunch. I noticed too that the left divs were lining up with right divs and was scratching my head trying to think of ways to correct the issue. The divs are generated by Virtuemart so I am not be able to individually style so I'm thinking that I may have to put a PHP character limit on the title length to prevent their height from going crazy.
You gave me lots of great ideas! You're awesome--