Solved

how to display a bottom right corner background graphic in IE7

Posted on 2009-04-01
3
803 Views
Last Modified: 2013-12-25
i have a bottom right corner image as a background on a div, this displays fine in earlier versions of IE and in firefox and safari, but is too far left on IE7.

can be viewed on http://espace.agirlocal.com
.fp-teaser-linkarea
  {
   background: #fef88b url(images/y-bright-solid.png) no-repeat right;   /*colour scheme  teaser bottom right*/
   padding-bottom:30px;
   margin-left:-15px;/*doesn't work in ie JCLK*/
   min-height:1%;/*to display in IE*/
   background-position: bottom right;
   text-align: right;
   padding-right:10px;
   }

Open in new window

0
Comment
Question by:Darko_Kantic
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
3 Comments
 
LVL 11

Expert Comment

by:level9wizard
ID: 24038126
I notice you have declared background positioning twice, here:
background: #fef88b url(images/y-bright-solid.png) no-repeat right;   /*colour scheme  teaser bottom right*/

and here:
background-position: bottom right;
(this is also backwards btw, horizontal then vertical).

Try:
background: #fef88b url(images/y-bright-solid.png) no-repeat right bottom; and remove the background position.
0
 

Author Comment

by:Darko_Kantic
ID: 24038811
thanks level9wizard - i'd already tried that - i can't remember why i added the extra background-position - but i have a nagging feeling it was to do with some other IE version.

i'm pretty sure the problem lies in the setting of the left margin.  this is picked up by firefox and the area filled with the background colour to merge nicely with my graphic.  but IE7 doesn't seem to like -15px
   margin-left: -15px;/*doesn't work in ie JCLK*/

Open in new window

0
 

Accepted Solution

by:
Darko_Kantic earned 0 total points
ID: 24038898
in fact all i needed to do was add:

min-height:0;

and everything is hunkydory
0

Featured Post

Turn Insights into Action

Communication across every corner of your business is essential to increase the velocity of your application delivery and support pipeline. Automate, standardize, and contextualize your communication processes with xMatters.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Australian government abolished Visa 457 earlier this April and this article describes how this decision might affect Australian IT scene and IT experts.
When the s#!t hits the fan, you don’t have time to look up who’s on call, draft emails, call collaborators, or send text messages. An instant chat window is definitely the way to go, especially one like HipChat. HipChat is a true business app. An…
The viewer will learn how to count occurrences of each item in an array.
This Micro Tutorial will demonstrate how to add subdomains to your content reports. This can be very importing in having a site with multiple subdomains.

696 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question