Stylesheets - other problem with IE

Author

other problem with IE

ste.paoletti@tiscali.it

2005-12-15, 6:45 pm

Ok, IE don't support CSS2 selector; thanks for your answers.
I'm trying another way but it work only in firefox and not in IE. Is
about the position:relative property.
I will be more cleare next:
I must create a test (with question and answer) and for the answer list
I have the following xhtml code:
....
<span class="answer">
<img
src="http://www.google.com/url?sa=D&q=http://groups.google.com/img/watched_y.gif"
class="image" />
<input type="radio" class="radio"/>
<span class="itemnum">1</span>
<span class="content">HERE COULD BE IMAGE , SPAN(WHIT TEXTCHILDNODES),
ECC</span>
</span>
<span class="answer">
<img
src="http://www.google.com/url?sa=D&q=http://groups.google.com/img/watched_y.gif"
class="image" />
<input type="radio" class="radio"/>
<span class="itemnum">2</span>
<span class="content">HERE COULD BE IMAGE , SPAN(WHIT TEXTCHILDNODES),
ECC</span>
</span>
....

and the following CSS:
..answer{
display:block;
}
..image{
display:inline;
}
..radio{
display:inline;
}
..itemnum{
display:inline;
}

..content{
display:block;
position:relative;
top:-10px;
left:40px;
}

The scope is align the image, radio, and number with the content (the
childs of content span must be all display:block)
In IE it should work?
I have strange result...
help please!
thanks

Steve Pugh

2005-12-16, 6:23 am

ste.paoletti@tiscali.it wrote:
> Ok, IE don't support CSS2 selector; thanks for your answers.
> I'm trying another way but it work only in firefox and not in IE. Is
> about the position:relative property.
> I will be more cleare next:
> I must create a test (with question and answer) and for the answer list
> I have the following xhtml code:
> ...
> <span class="answer">
> <img
> src="http://www.google.com/url?sa=D&q=http://groups.google.com/img/watched_y.gif"
> class="image" />

Missing the required alt attribute.

> <input type="radio" class="radio"/>
> <span class="itemnum">1</span>

Should this perhaps be a <label> element instead?

> <span class="content">HERE COULD BE IMAGE , SPAN(WHIT TEXTCHILDNODES),
> ECC</span>
> </span>
> <span class="answer">
> <img
> src="http://www.google.com/url?sa=D&q=http://groups.google.com/img/watched_y.gif"
> class="image" />
> <input type="radio" class="radio"/>
> <span class="itemnum">2</span>
> <span class="content">HERE COULD BE IMAGE , SPAN(WHIT TEXTCHILDNODES),
> ECC</span>
> </span>
> ...
>
> and the following CSS:
> .answer{
> display:block;
> }

So why not use <div> instead of <span>?

> .image{
> display:inline;
> }
> .radio{
> display:inline;
> }
> .itemnum{
> display:inline;
> }

inline is the default for those elements so why bother?

> .content{
> display:block;
> position:relative;
> top:-10px;
> left:40px;
> }

Looks reasonable, though again why not use a <div> and isn't the top:
-10px running the risk of successive lines overlapping? In general
margins are better than relative positioning for many situations.
Though without an actual page to look at it's impossible to say whether
that's the case here.

> The scope is align the image, radio, and number with the content (the
> childs of content span must be all display:block)
> In IE it should work?
> I have strange result...

Please post a URL so that we can see what the "strange result" is.

Steve