How can I create <span class="sub"> or class="sup"

HTML & CSS
1

[FONT=“Trebuchet MS”][COLOR=“Purple”]I’ve searched for any related issues and the search returned empty so if I missed any other post, please let me know.

I know there is a <sub></sub> and a <sup></sup>.
However, I would like to use a class and give it a name to use with a span.

ex: (this I can do, no problem) instead of
<strong>bolded text</strong>
I would do
<span class=“loud”>bolded text</span>

so, my need is instead of
<p>surface of 5<sup>2</sup>inches</p>
I would like to use
<p>surface of 5<span class=“expo”>2</span>inches</p>

I know it is longer to type out but it is still a requirement.
[/COLOR][/FONT]

2

what’s stopping you from doing exactly that?

3

how do I style it in the css?

.loud { font-weight: bold;}

.expo { what goes here? }

I haven’t found any css referring to sub or sup?

4

http://www.w3schools.com/Css/pr_pos_vertical-align.asp

5

duh!! I feel so stupid. I was looking for Font properties, never dawned on me to look at vertical align. THANK YOU SO MUCH.

6

Just out of curiosity, Louise, why the requirement for such non-semantic markup?

cheers,

gary

7

i wanted to ask that as well

what the heck is wrong with using SUP???

8

all our formatting must be done via css.
:blush:

9

You can still style sub and sup with css as you wish - CSS doesn’t care what element it is.:slight_smile:

10

<sub> and <sup> have nothing to do with formatting. Those elements indicate that the content are subscripts or superscripts. That they are usually rendered smaller and moved down or up has nothing to do with the fact that they are a subscript or superscript.

Soecifying H<sub>2</sub>O or x<sup>2</sup> are the only correct ways to mark up that content BEFORE you start thinking about how it should look.

11

I use <sub> and <sup> on my oldest site with a science section.
As stated above, H<sub>2</sub>O is the correct mark-up to use, not a span.
Remember, html was invented by a scientist, and <sub> and <sup> are tags with a specific meaning, not styles. You can style the size of the font that is within the tags with css if you want to.

12

Should be <b>bolded text</b>

<p>surface of 5<sup>2</sup>inches</p>
I would like to use
<p>surface of 5<span class=“expo”>2</span>inches</p>

Should be <p>surface of 5<sup>2</sup> inches</p>

Nuff said.

13

The OP is getting what things are mixed up with what they look like. They are trying to incorrectly mark up what things are using CSS which is NOT what CSS is for as that is for defining the appearance. What the things are (such as a subscript or superscript) should be marked up in the HTML which is where you define what the things are. If you are not going to define what things are using HTML then you will end up with

<span class=“html”><span class=“head”><span class=“title”>title goes here… etc

as the start of your HTML. Those tags are no different from the ones the OP is proposing to use so if they are going to try to define everything about what things are incorrectly via CSS then that’s what the HTML should start with since using any tag in the HTML other than span implies what something is and you are trying to move all of that to the CSS.

14

I agree with what’s been said, if it’s not a case of visually offsetting the text and there’s a real semantic reason for using SUP and SUB then those should be used in preference, in the case of displaying measurements (as per the OP’s post) there’s no justification not to use the correct elements for the right job. :slight_smile: