[Product-Developers] Need Help with PloneCustom.css and IE7
David Bain
david.bain at alteroo.com
Mon Mar 31 14:24:10 UTC 2008
To be more explicit, The problem is that when IE gets 128px for the
height of portal-logo, it doesn't "believe" you. You really only need
to add the following to your IEFixes.css::
#portal-logo
{
height: 85px;
}
This will tell IE (and only IE) to have a height of 85px on the
portal-logo, everyone else will continue to see the 128px.
On Mon, Mar 31, 2008 at 9:21 AM, David Bain <david.bain at alteroo.com> wrote:
> Mark,
> Place normal code in your ploneCustom.css (remember IE is NOT normal,
> it is very disobedient).
>
> Then place the IE specific code in IEFixes.css.
>
> also remember I had suggested creating a new stylesheet just for IE7
> (IE7Fixes.css).
>
> <!-- Internet Explorer CSS Fixes -->
> <!--[if IE 7]>
>
> <style type="text/css" media="all">@import
> url(http://plone.org/IE7Fixes.css);</style>
> <![endif]-->
>
> If there is something IE7 specific, put it in the IE7Fixes.css.
>
> I'm cc-ing the product developers list in case others may find this helpful.
>
> On Sun, Mar 30, 2008 at 8:24 PM, Mark Phillips
>
>
> <mark at phillipsmarketing.biz> wrote:
> > David,
> >
> > I found, through trial and error, a way to fix the problem, but I don't
> > know how to make the solution work for both IE and non-IE browsers. This
> > is what I found. (Note: the logo image is 128 px high)
> >
> > I have the following css:
> >
> > #portal-top
> > {
> > background: #6F8EC4 top left url(<dtml-var portal_url>/clouds.jpg)
> > no-repeat;
> > }
> >
> > #portal-logo
> > {
> > background: none;
> > padding: 0;
> > margin: 0;
> > height: 128px;
> > width: 100%;
> > border-bottom: 1px solid #FFFFFF;
> > }
> >
> > This gives the extra blue border between the logo image and the tabs
> > only for IE browsers. Other browsers are correct.
> >
> > If I change the height in #portal-logo to 85px, then the blue border
> > goes away in IE, but the other browsers are messed up. The tabs encroach
> > into the logo image area.
> >
> > How do I make this height conditional depending on the browser type?
> >
> > I read the following, http://www.javascriptkit.com/howto/cc2.shtml, and
> > tried putting in two #portal-logo blocks, one like this:
> >
> > <!--[if IE]>
> > #portal-logo {....}
> > <[endif]-->
> >
> > and a height of 85px, and the other with
> >
> > <![if !IE]>
> > #portal-logo {....}
> > <![endif]>
> >
> > and a height of 128px, but both browser displays have the tabs
> > encroaching on the logo image.
> >
> > Thanks for any suggestions you have!
> >
> > Mark
> >
> >
> >
> > On Sun, 2008-03-30 at 17:31 -0400, David Bain wrote:
> > > Yes... you'll want to use firebug (a firefox add-on) it can help you
> > > to isolate the exact css that affects that section. Then you can add a
> > > custom version of it for IE where appropriate.
> > >
> > > On Sun, Mar 30, 2008 at 4:23 PM, Mark Phillips
> > > <mark at phillipsmarketing.biz> wrote:
> > > >
> > > >
> > > >
> > > > David,
> > > >
> > > > No luck finding the root cause. Does my explanation and the screen
> > > shots
> > > > give you any ideas?
> > > >
> > > > Thanks,
> > > >
> > > > Mark
> > > >
> > > >
> > > >
> > > > ----- Original Message -----
> > > > From: pigeonflight at gmail.com <pigeonflight at gmail.com>
> > > > To: Mark Phillips
> > > > Sent: Sun Mar 30 16:49:06 2008
> > > > Subject: Re: [Product-Developers] Need Help with PloneCustom.css
> > > and IE7
> > > >
> > > > Mark,
> > > > Haven't been on my email much over the weekend. How is the css
> > > issue going?
> > > >
> > > > On Sun, Mar 30, 2008 at 8:14 AM, Mark Phillips
> > > > <mark at phillipsmarketing.biz> wrote:
> > > > > David,
> > > > >
> > > > >
> > > > > If you compare MSIE6 with any of the other screen shots you
> > > requested at
> > > > > browsershots.org, you can also see the problem. There is an
> > > extra blue
> > > > > band under the logo image and above the tabs. This band is not
> > > present
> > > > > in the other screen shots. MSIE5.5 does not show the problem.
> > > > >
> > > > > Yes, I have installed firebug. I have not been able to find the
> > > source
> > > > > of the problem. I must admit, I am not a CSS guru nor a plone
> > > skins
> > > > > guru, so I am also struggling with where to look/how to debug
> > > this
> > > > > problem. But I keep learning more and more from experts on the
> > > plone
> > > > > lists!! :-)
> > > > >
> > > > > I did not know about browsershots.org. A really cool tool.
> > > Thanks for
> > > > > that tip!! I am happy to see that this problem only shows up on
> > > IE6 and
> > > > > IE7.
> > > > >
> > > > > Mark
> > > > >
> > > > > On Fri, 2008-03-28 at 11:10 -0400, David Bain wrote:
> > > > >
> > > > >
> > > > > > Mark,
> > > > > > It is difficult to understand the differences you describe at
> > > the
> > > > > > moment, so I've requested some screenshots at browsershots.org
> > > (very
> > > > > > useful tool).
> > > > > >
> > > > > > http://browsershots.org/http://arcadialittleleague.com/
> > > > > >
> > > > > > BTW. Have you tried using the firefox add-on firebug?
> > > > > >
> > > > > >
> > > > > > On Fri, Mar 28, 2008 at 8:35 AM, Mark Phillips
> > > > > > <mark at phillipsmarketing.biz> wrote:
> > > > > > >
> > > > > > >
> > > > > > >
> > > > > > > David,
> > > > > > >
> > > > > > > Thanks for the good idea. Separating out various css
> > > modules is a
> > > > > > great
> > > > > > > programming technique.
> > > > > > >
> > > > > >
> > > > > > Yes, this technique is the best approach. Generally most other
> > > > > > browsers will work with standard css, but IE tends to be
> > > quirky and
> > > > > > unfortunately the different versions of IE can often be quirky
> > > in
> > > > > > different ways, hence the suggestion for an IE 7 specific
> > > stylesheet.
> > > > > >
> > > > > >
> > > > > > > I have found that none of the IE fixes added to my css
> > > impact the
> > > > > > site
> > > > > > > in other browsers. So, I just add them to plonecustom.css
> > > at the
> > > > > > top.
> > > > > > >
> > > > > > > Any thoughts on how to fix the size of the logo in IE for
> > > my site?
> > > > > > >
> > > > > > > Thanks again,
> > > > > > >
> > > > > > > Mark
> > > > > > >
> > > > > > >
> > > > > > >
> > > > > > > On Wed, 2008-03-26 at 21:16 -0400, David Bain wrote:
> > > > > > > > Try using a conditional statement that selects for IE7
> > > > > > > > Include an IE7Fixes.css and put adjustments there.
> > > > > > > > <!-- Internet Explorer CSS Fixes -->
> > > > > > > > <!--[if IE 7]>
> > > > > > > >
> > > > > > > > <style type="text/css" media="all">@import
> > > > > > > url(http://plone.org/IE7Fixes.css);</style>
> > > > > > > > <![endif]-->
> > > > > > > >
> > > > > > > > see:
> > > > > > > > http://www.javascriptkit.com/howto/cc2.shtml
> > > > > > > > for details.
> > > > > > > >
> > > > > > > > On Wed, Mar 26, 2008 at 1:47 PM, Mark Phillips
> > > > > > > > <mark at phillipsmarketing.biz> wrote:
> > > > > > > > I have a site up and running (www.arcadiall.com)
> > > that
> > > > > > uses
> > > > > > > > PloneSkins.org as a skin template. It looks great
> > > in
> > > > > > firefox,
> > > > > > > > mozilla,
> > > > > > > > epiphany, etc on both windows and Linux. However,
> > > IE7 is
> > > > > > > > causing my hair
> > > > > > > > to fall out.
> > > > > > > >
> > > > > > > > The logo image has a color fill behind it. On all
> > > the
> > > > > > "good"
> > > > > > > > browsers,
> > > > > > > > the portal top is the size of the portal logo
> > > image,
> > > > > > which
> > > > > > > > sits very
> > > > > > > > nicely on top of the tabs. In IE7, there is a
> > > large band
> > > > > > of
> > > > > > > > background
> > > > > > > > color between the logo image and the tabs. I
> > > can't seem
> > > > > > to
> > > > > > > > remove it,
> > > > > > > > and I don't know why it is there.
> > > > > > > >
> > > > > > > > I tried the latest info on the plone site
> > > > > > > >
> > > > > > (http://plone.org/documentation/how-to/plone-ie7-updates), but
> > > > > > > > those
> > > > > > > > fixes for IE7 do not help.
> > > > > > > >
> > > > > > > > Any assistance will be greatly appreciated!!
> > > > > > > >
> > > > > > > > Thanks,
> > > > > > > >
> > > > > > > > Mark
> > > > > > > >
> > > > > > > >
> > > > > > > >
> > > > > > > > _______________________________________________
> > > > > > > > Product-Developers mailing list
> > > > > > > > Product-Developers at lists.plone.org
> > > > > > > >
> > > > > > http://lists.plone.org/mailman/listinfo/product-developers
> > > > > > > >
> > > > > > >
> > > > > >
> > > > > >
> > > > >
> > > > > _______________________________________________
> > > > > Product-Developers mailing list
> > > > > Product-Developers at lists.plone.org
> > > > > http://lists.plone.org/mailman/listinfo/product-developers
> > > > >
> > > >
> > >
> > >
> >
>
More information about the Product-Developers
mailing list