Simple CSS question

Sep 29, 2004
18,656
68
91
I have an issue. I can get this to work in IE but not FF. I'll skip what I'm doing and just ask what I should do.

I have a TABLE in HTML deinfed with calss="foo". In it I have the typcial TR and TDs.

Now, with a TD, I could have this:
My Dog is red

I want the word Dog to be cotnrollable via CSS so that I can make it Red, boldfaced or both.

How do I do this?
 

Ken g6

Programming Moderator, Elite Member
Moderator
Dec 11, 1999
16,836
4,815
75
Code:
<table class=foo>
<tr><td>My <span class="dog">Dog</span> is red</td></tr>
</table>

Is that what you wanted? :hmm:
 
Sep 29, 2004
18,656
68
91
That seems to be it. I tried div, font, p and probably a few other things.

Of to read about the span element.

Funny (to me) is that everything I tried worked in Firefox and not in IE.
 

saratoga172

Golden Member
Nov 10, 2009
1,564
1
81
I believe you can use divs instead of tables, no? Kind of the new age CSS websites. You'd just have to define an "id" name inside the div tag.

Ex:
<div id="dog">Dog</div>

Please enlighten me on HTML skills. It's been about 4 years since I've done any HTML or website work outside of modifying and using templates now.
 

Cogman

Lifer
Sep 19, 2000
10,286
147
106
I believe you can use divs instead of tables, no? Kind of the new age CSS websites. You'd just have to define an "id" name inside the div tag.

Ex:
<div id="dog">Dog</div>

Please enlighten me on HTML skills. It's been about 4 years since I've done any HTML or website work outside of modifying and using templates now.

Tables are to be used when you are dealing with tabular data. There are a lot of evangelists that preach that nobody should use tables anywhere, I disagree with this. Tables are great when you have rows and columns of data to display. They are not so great if you are trying place an element at position x.


As for the OPs problem, What versions of IE are you targeting? I've recently found that newer versions of IE don't like running their newer renders unless you tell them to. Make sure you have a doctype at the top of the page and a <meta http-equiv="X-UA-Compatible" content="IE=edge" /> tag in your head. These instruct all versions of IE from 7 on to use their most standards compliant renders available. Without them, IE might try to emulate IE5 or 6.
 

Ken g6

Programming Moderator, Elite Member
Moderator
Dec 11, 1999
16,836
4,815
75
I believe divs start and end on a newline. Spans just add CSS anywhere, without changing formatting.
 
Sep 29, 2004
18,656
68
91
DIV doesn't do it. It works in FF, but not IE (latest version).

The only thing that works in IE is SPAN.

What are the alternatives to using a TABLE? I probably won't change hte way I have done things but I'd like to read up on it.
 

Cogman

Lifer
Sep 19, 2000
10,286
147
106
I believe divs start and end on a newline. Spans just add CSS anywhere, without changing formatting.

Divs default to display: block; spans default to display: inline. That is the difference.

An alternative to a table is display: table;

The general usage (AFAIK) is that divs describe a box of elements while spans describe a single element or piece of text.. Though, they are really very generic elements that can be defined however you like. Other than what I mentioned above, they don't really carry any other special style meaning. (and the meaning they do carry can be easily overwritten).
 

Cogman

Lifer
Sep 19, 2000
10,286
147
106
DIV doesn't do it. It works in FF, but not IE (latest version).

The only thing that works in IE is SPAN.

What are the alternatives to using a TABLE? I probably won't change hte way I have done things but I'd like to read up on it.

If you want to control the css of individual words, then you need to wrap each word in a span (or at least each word you want to change). *edit*nm they using naughty b tags in vb forum*/edit*
 

Wyndru

Diamond Member
Apr 9, 2009
7,318
4
76
Funny (to me) is that everything I tried worked in Firefox and not in IE.
I'm not a seasoned web developer by any means, but the more I learn I realize that if I code with IE in mind, usually Firefox is ok with the formats. If I do all of my testing in FF, it's usually a nightmare to get it right in IE afterward.
 
Sep 29, 2004
18,656
68
91
Wyndu,

I am bascially in the same place as you. Same level of skill regarding web dev.

I get things working in FF (I love Firebug so I develop there) and I usually have to tweak things in IE.