473,390 Members | 1,323 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,390 software developers and data experts.

inline background image in IE

OK, so here's a new one for the group...

I have the two following classes:

.ratings_link {
display: block;
background: #ffeec1 url(image.gif) no-repeat center right;
font: bold Arial, Helvetica, sans-serif;
color: #176fcc;
text-decoration: none;
margin-top: 3px;
}

.ratings_link_inline {
background: #ffeec1 url(image.gif) no-repeat center right;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
color: #176fcc;
text-decoration: none;
padding: 1px 20px 1px 1px;
}

The first class works just fine as it displays block style. The background image is aligned right, with no repeat. Wonderful.

Now, for the second, I need this to be an inline style. Everything seems to work fine but the background image does not show in IE. I tried inserting display:inline in the class, but that does nothing. Nor does putting it inside a div. Simply, the code is:

1. <a href="link.htm" class="ratings_link">link 1</a>
2. <a href="link.htm" class="ratings_link_inline">link 1</a>

Any suggestions? Thanks.
Aug 9 '07 #1
5 3219
drhowarddrfine
7,435 Expert 4TB
Hm. Works for me. .
Aug 9 '07 #2
Really?? I've checked in both IE 6 and 7.

Please look at it on an actual page:
http://granthansen.com/bg_test.html

Do you see the red square on the second style?

I found this article that explains IE doesn't handle positioning well for non-block items:

http://www.satzansatz.de/cssd/wrappinglinkbg.html

Thanks!
Aug 10 '07 #3
I'm noticing some positioning things ... now it's showing up, just not in the right place :-)
Aug 10 '07 #4
I got her working ... needed an IE hack though

http://granthansen.com/bg_test.html

Thanks for your help!
Aug 10 '07 #5
drhowarddrfine
7,435 Expert 4TB
I do not see the problem in IE6 but I do only partially see the red square in IE7. I had only checked in IE6 before. The solution is not obvious right now but I'm not really here today (out of the office).
Aug 10 '07 #6

Sign in to post your reply or Sign up for a free account.

Similar topics

1
by: Desigan Chinniah | last post by:
I am presently trying to display a list of items INLINE using an image as a seperator..... and having difficulties.... See below for 3 seperate sets of html and css files. Each set does something...
46
by: DJ WIce | last post by:
Hi all, I did make a script/css thing to replace the contextmenu on the website with a new one: http://www.djwice.com/contextmenu.html It works nice in MSIE, but on Netscape (and probable...
3
by: Aaron | last post by:
Hi, I'm trying to use style sheets instead of tables for layout, but I'm not sure on how to do something... I have a div (100% width) containing 3 other divs. Each needs to be lined up next to...
1
by: Johannes Theile | last post by:
Hi, is it possible to show the bullets in a list (ul), although it is possitioned as an inline element? Greetings, Johannes
12
by: Stanimir Stamenkov | last post by:
Here are two cases regarding inline-level elements' line-height, padding and background, which I doesn't understand: <div style="background: black; color: white; line-height: 1.5">...
3
by: Mark Tranchant | last post by:
On my site, I use a background image of a small arrow to denote links that lead away from my site. This page has four such links in the first section: http://tranchant.plus.com/notes/cable-wrap...
1
by: Jens | last post by:
An image like this one <html> test1<img src="" style="width:100;height:100"/>test2 </html> is in line with the text and has a width and height. How can I get the same with a span or div...
3
by: Jannette | last post by:
I've got this to finally work in IE (its only taken me 2 days solid), but now mozilla isn't displaying the text on the same line as the image. I'm a newby at CSS, and I've think I've worked on trying...
7
by: massic80 | last post by:
Hi everybody! I'm making a page for an exam at uni. In two DIV blocks of it there should appear (and disappear) some "icons", due to XML messages, so I dunno how many of them should I can obtain;...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.