I have a span containing two words. Eg.
<span>Avant Garde</span>
Using CSS, I pad the text to the right and assign a background-image. Eg.
span {
padding: 0 3px 0 11px;
background: url(images/tagbull.gif) no-repeat 0px 2px;
}
The tag renders as expected...unle ss the line wraps in the middle of the
two words. Then the background-image doesn't appear in IE6, but it
renders fine in Firefox. Is this a browser bug?
To see an example, browse the following URL with IE6 and expand the "10
Tags" link: <http://arty.me.uk/2006/01/04/announcing-avantist/>
--
Walker
arty.me.uk
Jan 5 '06
16  14629 
Els wrote: Barbara de Zoete wrote:
On Thu, 05 Jan 2006 22:47:38 +0100, Els <el*********@ti scali.nl> wrote:
Walker wrote:
The tag renders as expected...unle ss the line wraps in the middle of the
two words. Then the background-image doesn't appear in IE6, but it
renders fine in Firefox. Is this a browser bug?
A workaround might be to have two spans:
<span><spa n> </span>some words</span>
span span {
padding: 0 3px 0 11px;
background: url(images/tagbull.gif) no-repeat 0px 2px;
}
Or to prevent the line break (if the span is just a two or three words
anyway).
Yup - that would work very well too <g>
Presumably with { white-space: nobr } ? I tried that a few days ago but
it invalidated the code.
--
Walker
arty.me.uk
Walker wrote: Els wrote: Barbara de Zoete wrote:
On Thu, 05 Jan 2006 22:47:38 +0100, Els <el*********@ti scali.nl> wrote:
Walker wrote:
>The tag renders as expected...unle ss the line wraps in the middle of the
>two words. Then the background-image doesn't appear in IE6, but it
>renders fine in Firefox. Is this a browser bug?
A workaround might be to have two spans:
<span><span > </span>some words</span>
span span {
padding: 0 3px 0 11px;
background: url(images/tagbull.gif) no-repeat 0px 2px;
}
Or to prevent the line break (if the span is just a two or three words
anyway).
Yup - that would work very well too <g>
Presumably with { white-space: nobr } ? I tried that a few days ago but
it invalidated the code.
No, with
--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Els wrote: Walker wrote:
Els wrote:
Barbara de Zoete wrote:
Or to prevent the line break (if the span is just a two or three words
anyway).
Yup - that would work very well too <g>
Presumably with { white-space: nobr } ? I tried that a few days ago but
it invalidated the code.
No, with
Ah, I didn't know an would do that. I'll make a mental note of
it. Probably not the best solution for this scenario because the tags
(and spaces between words) are generated by a third-party PHP plugin
which I'd rather not modify -- otherwise, everytime there's a new
release, I'd have to do the mod all over again. The beauty of your
nested span solution is that the PHP function accepts the before and
after tags as a parameter, so I only have to modify my own template.
--
Walker
arty.me.uk
Walker wrote: Els wrote: Walker wrote:
Els wrote:
Barbara de Zoete wrote:
>Or to prevent the line break (if the span is just a two or three words
>anyway).
Yup - that would work very well too <g>
Presumably with { white-space: nobr } ? I tried that a few days ago but
it invalidated the code.
No, with
Ah, I didn't know an would do that.
-> non breaking space :-)
I'll make a mental note of
it. Probably not the best solution for this scenario because the tags
(and spaces between words) are generated by a third-party PHP plugin
which I'd rather not modify -- otherwise, everytime there's a new
release, I'd have to do the mod all over again. The beauty of your
nested span solution is that the PHP function accepts the before and
after tags as a parameter, so I only have to modify my own template.
Good :-)
--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Walker <wa**********@g mail.com> wrote: The tag renders as expected...unle ss the line wraps in the middle of the
two words. Then the background-image doesn't appear in IE6, but it
renders fine in Firefox. Is this a browser bug?
No, not really.
This is a detail that is explicitly not yet addressed by the CSS 2.1
standard. Here's what the official CSS 2.1 specification says:
"The tiling and positioning of the background-inamge on inline
elements is ndefined in this spcification. A future level of CSS may
define the tiling and positioning of the background-image on inline
elements."
<http://www.w3.org/TR/CSS21/colors.html#pro pdef-background-repeat>
--
Alexander
Els wrote:
Presumably with { white-space: nobr } ? I tried that a few days ago but
it invalidated the code.
Because it should have been: { white-space: nowrap; }
--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Jim Moe wrote: Els wrote:
Presumably with { white-space: nobr } ? I tried that a few days ago but
it invalidated the code.
Because it should have been: { white-space: nowrap; }
Wasn't me that typed the post you are replying to - please don't
misquote :-)
--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo - This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics | |
by: kAldam |
last post by:
I am currently using IE 6.0 and 5.5 and the scenario is the following.
I have a span that contains text, and the span is beign contained by a
table cell (this is the way thing need to be in my application). I
have an issue when the span has a heigth less than 18px (meaning
height of the span, there is only one line of text and the height of
the text is less than 18). The issue is that I start getting a
padding, I add a color background to...
|
by: Mr. Clean |
last post by:
Why would this work:
<html>
<head>
<title>Page 1</title>
</head>
<body style="background:#C2BFA5;">
<span style="text-align: center;
border:thin inset;
position:absolute;
left:14px;
|
by: JimO |
last post by:
I'm new to CSS and I'm trying to figure out the difference between the
Header tags, div, span, and p tags as they relate to style sheets. They
each render slightly different in the browser and accept different styles.
I was wondering if there is any hard and fast rule or if it's just a matter
of playing around and discovering ones preferences.
Thanks,
Jim
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
by: JimO |
last post by:
I'm new to CSS and I'm trying to figure out the difference between the
Header tags, div, span, and p tags as they relate to style sheets. They
each render slightly different in the browser and accept different styles.
I was wondering if there is any hard and fast rule or if it's just a matter
of playing around and discovering ones preferences.
Thanks,
Jim
|
by: jawolter |
last post by:
I have text that is too long to nicely fit on a given page, so I want
to add ellipses to the end that dynamicaly resize based on the person
resizing the page width. If you hover it would show the full text,
using a title attribute I believe.
It works for a div, but not a span... any ideas?
Here's a snippet that I'm working on:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
| | |
by: ricky |
last post by:
Hello,
If anyone could help me with this I would highly appreciate it. I've
tried everything and nothing works. What I am trying to do is so damn
basic and it's just frustrating that it seems there's no support for
this. Either that or I'm doing something wrong. Well, enough venting,
here's what I need.
Using this sample XML file (test.xml):
|
by: reproots |
last post by:
hi there,
i am having trouble with a span command and would like to know if
someone can help me, or point me in the correct direction. basically, i
want a little textbox to pop up when a mouse rolls over text within a
paragraph (without breaking the text up). my knowledge is pretty basic,
but, by looking at other websites, i have been able to put together the
following javascript/CSS command. however, it only works with a DIV
command,...
|
by: David Housman |
last post by:
Hello,
I'm trying to implement a navigation bar with a ul in css. The code is
a template, but i'm customizing. I can handle just text in each block,
but i want the first block to have an image and then text, which I'm
doing with a span element. I think i need it that way to handle text
positioning of the text.
So there's an anchor block, and inside4 that i'm putting an image and
a span block.
|
by: pbd22 |
last post by:
Hi.
I have been wrestling with getting a span (or a few)
to live inside a few divs. I want to put padding around
the span but it seems to move independent of the divs
even though there is no float. I am wondering if display:block
is messing stuff up? Or, something else?
do you see what I am doing wrong?
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed.
This is as boiled down as I can make it.
Here is my compilation command:
g++-12 -std=c++20 -Wnarrowing bit_field.cpp
Here is the code in...
|
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
| | |
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own....
Now, this would greatly impact the work of software developers. The idea...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules.
He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms.
Adolph will...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one.
At the time of converting from word file to html my equations which are in the word document file was convert into image.
Globals.ThisAddIn.Application.ActiveDocument.Select();...
|
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
|
by: 6302768590 |
last post by:
Hai team
i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
|
by: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| | |
by: bsmnconsultancy |
last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...
| |
