Helllllp! IE screws up my new template!
Posted: Fri Dec 30, 2005 4:15 pm
If my kids don't do it first, IE is going to drive me insane.
I've been trying to create a new template based on the Holy Grail. I've figured out how to make it adjustable two- or three-column, with the content always first in the HTML for search engine optimization. I couldn't get the "IE7" script to reliably process PNG images, so I hacked the CSS to use GIFs for the IE users. I also figured out how to keep the sidebars from expanding with the "overflow" attribute.
My new CSS trick for this template is drop shadows. All the sidebar items and entries have them. However, the newsboxes are refusing to work in IE. To show off my new Smarty-compliant newsbox plugin, I made them fieldsets (by default, they're divs). Each is set to a width of 47% and floated left. In FF, they show up side-by-side, with drop shadows, as intended.
In IE, the fieldsets take up a huge chunk of screen (although the contents only take up about 47% of their container), forcing them to sit on top of each other. And the drop-shadows are either tiny or overlapping (turning them black), and they change if you scroll up and down the screen.
The banner text is also having trouble. On my IE, it's not displayed at all until you scroll it off screen and return to it. Then it looks fine.
I'm hoping some kind soul (<whine>Carl</whine>) will have a look and tell me what I'm missing here. This is a work in progress, so don't expect to be impressed or anything. To see what I'm talking about, visit judebert.com and choose the Ladybug template.
Thanks in advance,
Judebert
I've been trying to create a new template based on the Holy Grail. I've figured out how to make it adjustable two- or three-column, with the content always first in the HTML for search engine optimization. I couldn't get the "IE7" script to reliably process PNG images, so I hacked the CSS to use GIFs for the IE users. I also figured out how to keep the sidebars from expanding with the "overflow" attribute.
My new CSS trick for this template is drop shadows. All the sidebar items and entries have them. However, the newsboxes are refusing to work in IE. To show off my new Smarty-compliant newsbox plugin, I made them fieldsets (by default, they're divs). Each is set to a width of 47% and floated left. In FF, they show up side-by-side, with drop shadows, as intended.
In IE, the fieldsets take up a huge chunk of screen (although the contents only take up about 47% of their container), forcing them to sit on top of each other. And the drop-shadows are either tiny or overlapping (turning them black), and they change if you scroll up and down the screen.
The banner text is also having trouble. On my IE, it's not displayed at all until you scroll it off screen and return to it. Then it looks fine.
I'm hoping some kind soul (<whine>Carl</whine>) will have a look and tell me what I'm missing here. This is a work in progress, so don't expect to be impressed or anything. To see what I'm talking about, visit judebert.com and choose the Ladybug template.
Thanks in advance,
Judebert