Now, this is an improvement over the second quiz which surprisingly was not as straight forward as i wanted. Now, all we are trying to do here is to just add margin top and bottom to the span tag.
There is no gimmick in this one, [s]except maybe your browser is just not getting the margins right![/s]

For fear of the spam bot, i decided to post an image this time.

BTW, you are not [size=16pt]allowed[/size] to make use of the css margin property, although i will not advise it (for reasons best known to me).

Ewa o, kilode? not even a single reply?
Has somebody tried .spacer {margin-top:50px;margin-bottom:50px} ? Dime!! oya, vien, reply por favor, merci! ejooor!

Though I have not, due to time (and better things to do) verified this for myself, my understanding is that inline elements, SPAN being one of them, don't respond to top/bottom margin and padding, only left and right.  This might be browser-dependent though.

Again, I haven't verified this from an official (as in w3c) source though I have experienced the above on several projects that I have worked on, over the years.

I think, IMHO, it is better for you to post an image of your question than type it out in English. I personally find your questioning very confusing (no offense).

To answer your question:
I would probably make use of line-height.

yawa-ti-de:

Though I have not, due to time (and better things to do) verified this for myself, my understanding is that inline elements, SPAN being one of them, don't respond to top/bottom margin and padding, only left and right.  This might be browser-dependent though.

Again, I haven't verified this from an official (as in w3c) source though I have experienced the above on several projects that I have worked on, over the years.

I think, IMHO, it is better for you to post an image of your question than type it out in English. I personally find your questioning very confusing (no offense).

To answer your question:
I would probably make use of line-height.

muhahahaha. si, pero of course, you are correct. line-height will do just fine, margins will never work with the span tag - since it is not a css box object.
If it were to be DIV rather than span, you can use margin/padding since those are exclusive for box objects. Well, this is for the css learners though.

@yawatide, i usually post jscript questions, so i thought for a change tis good i do some css stuffs. I will be back luego with more css stuffs.

mi problemo con mis preguntas es that es facil a escribe codes como ingles! lo siento!!

I didn't say you shouldn't post CSS questions o. I am only saying make them clearer. BTW, as confusing to me as they might have been, I do enjoy them. They help stimulate my brain

One advantage of coding for a long time is that I have pretty much seen everything, codewise, under the sun, from the good to the bad to the ugly and to the terribly ugly

Well, same goes for me too. BTW these preguntas eres por estudiante nuevo y not for advanced people like you and I!
But yes, it helps stimulate the brain sha. . . and i do know some people are learning from these sha, even if they cannot
answer it correctly.
But of course, i will post any quiz questions in any d-h-t-m-l language that i feel like, just that, (pero i wont do site reviews)

Add

<div style="padding:50px; background:#whatever color hex code"><span>, </span></div>

instead,

@youngbobby:
I think, and I am pretty sure, that OP asked, "what would you add to the spacer class . . ." If you look closely, you will notice that there is no spacer class associated with the div tag surrounding the span tags.

youngbobby:

Add

<div style="padding:50px; background:#whatever color hex code"><span>, </span></div>

instead,

This is teaching. I remember trying to line-space the span tag - that was the quiz question. And the answer according to
yawatide which i agree by 100% is that - it can be done with line-height because span is an inline element and is not
a box object, so it will not respond to regular margin and padding. . .

Sorry Guys, I missed out form the beginning! Av been out of work for three days now, and FYI, I have been helping my wife in the labour room while delivering our first baby. I'm really happy and I'm in a super mood today. . . *Yay*

To the question. with the way the browser snapshot is showing the output of what you are trying to do with the spacer class, I think I'ld rather use an unordered list. Reason is I'm not very sure if the span class can take "Display: inline-box" for span but if it does, then it takes care of everything else. But on a safer side, I prefer to use Unordered list. as in:

HTML:

<ul>
<li>facebook</li>
<li>twitter</li>
<li>google</li>
<li>yahoo</li>
</ul>

CSS:

ul {
overflow:hidden; (to prepare the Unodered lit for float)
width: auto; (to auto expand the width)
}

ul li {
float:left; (this would allow them to list beside each other)
margin: 5px 0 5px 0; (We have added our margin top and bottom)
list-style: none; (to remove the list bullets)
}

This is semantically correct and Like you said. this is 100% Gimmicks free.

Sorry Guys, I missed out form the beginning! Av been out of work for three days now, and FYI, I have been helping my wife in the labour room while delivering our first baby. I'm really happy and I'm in a super mood today. .  .  *Yay*

To the question. with the way the browser snapshot is showing the output of what you are trying to do with the spacer class, I think I'ld rather use an unordered list. Reason is I'm not very sure if the span class can take "Display: inline-box" for span but if it does, then it takes care of everything else. But on a safer side, I prefer to use Unordered list. as in:

HTML:

<ul>
    <li>facebook</li>
    <li>twitter</li>
    <li>google</li>
    <li>yahoo</li>
</ul>

CSS:

ul {
overflow:hidden; (to prepare the Unodered lit for float)
width: auto; (to auto expand the width)
}

ul li {
float:left; (this would allow them to list beside each other)
margin: 5px 0 5px 0; (We have added our margin top and bottom)
list-style: none; (to remove the list bullets)
}

This is semantically correct and Like you said. this is 100% Gimmicks free.

Am a newbie to webdesign(2wks). Learning html presently.
Please I need help with this:
I am trying to use a .gif image for bulleting.
The books that am using says;
<ul src=url>list</ul>
the gif is in the same location as the page am working on so I did;
<ul src="image.gif ">the list goes here</ul>
but I am not getting it, please any pointers on what I am doing wrong.
Thanks Guys.

ceeboy:

Am a newbie to webdesign(2wks). Learning html presently.
Please I need help with this:
I am trying to use a .gif image for bulleting.
The books that am using says;
<ul src=url>list</ul>
the gif is in the same location as the page am working on so I did;
<ul src="image.gif ">the list goes here</ul>
but I am not getting it, please any pointers on what I am doing wrong.
Thanks Guys.

Use this

<ul style="list-style-image: url(image.gif);">the list goes here</ul>

It should be pretty clear but if you still need any explanations, do post here.



@bouzymill
Congrats on your baby.

Thanks Uncle Dual Core, it worked like magic.

@bouzymill:
Congrats on the safe delivery an on the arrival of your first baby.

Yep, there are better ways of approaching the problem but I think, IMHO, OP was just asking for a solution based on the code at hand, as opposed to the best way to approach a solution.

congratulations amigo por the nino nuevo. Now dual core, you need to pay tax task tasks (for trading in my absence)

You're welcom ceeboy.



*dhtml, send me an invoice

Thanks to you all. . . I really appreciate it.

yawa-ti-de:

Yep, there are better ways of approaching the problem but I think, IMHO, OP was just asking for a solution based on the code at hand, as opposed to the best way to approach a solution.

I know right. . . lol. Cos when I finished answering the question. I was like, "shey na wetin dem ask you be dis sha?" Now I know the reason I failed Jamb so much!

Lol. . .you no serious