7 {{ upvoteCount | shortNum }}
7 {{ upvoteCount | shortNum }}

SPAN not appearing...

by shipwrecked
6 replies
  • WEB DESIGN
    • |
Hi,

I am trying to use <span> as a spacer between two vertical boxes on my site. I want to use <span> and not <br/>, because <span> can be adjusted - in this case I need a thinner space than <br/> could make...

My span is not working, not appearing:

CSS:
Code:
.3pxspace{display: block; width: 3px; height: 3px; background-color: #FFFFFF;}
in the .PHP code:
Code:
<span class="3pxspace" style="display: block"></span>
I know <span> is normally an inline element, so I put the "display: block" there, just in case this might help...

Tried "display: inline"... didn't work.

I could simply not use CSS, could make it all inline, haven't tried that way, but I need the CSS, because I will have so many pages...

Any ideas on how to make <span> spacer appear?

Oh, and, I don't want to use any DIVs.
#appearing #span
  • Profile picture of the author RobinInTexas
    Try
    Code:
    <span class="3pxspace" style="display: block">&nbsp;</span>
    It would really be better to use <div>
    Signature

    Robin



    ...Even if you're on the right track, you'll get run over if you just set there.
    {{ DiscussionBoard.errors[8125317].message }}
  • Profile picture of the author shipwrecked
    I also have to type in "&nbsp;" for DIVs, but I was hoping it would appear empty...

    OK - so why use DIVs? I learned a few months ago that specifically for spacing it's better to use SPAN.

    Why use DIVs?

    What would you use SPAN for, then, if not for this?
    {{ DiscussionBoard.errors[8125366].message }}
    • Profile picture of the author Patrick
      Originally Posted by shipwrecked View Post

      I also have to type in "&nbsp;" for DIVs, but I was hoping it would appear empty...

      OK - so why use DIVs? I learned a few months ago that specifically for spacing it's better to use SPAN.

      Why use DIVs?

      What would you use SPAN for, then, if not for this?
      If you are using <div> then there is no need to add display:block

      Divs are block elements while span is an inline element...

      If you use

      Code:
      <div>First</div><div>Second</div>
      The output would be:

      First
      Second

      Code:
      <span>First</span> <span>Second</span>
      Output would be:

      First Second
      Signature
      Freelance WordPress Developer | Free WordPress Themes | Free WordPress Plugins | Free WordPress Support
      {{ DiscussionBoard.errors[8127175].message }}
  • Profile picture of the author RobinInTexas
    If you really need to fudge things with a div, you can create a div to force spacing with margins.
    Code:
    .uniquename { 
float:left; margin-top: -15px; margin-right: 1px; 
margin-bottom: 15px; margin-left: 2000px;
}
    It's not pretty but often is a quick easy way to position elements. If you place each box in it's own div, you can position them. Including off the screen.
    Signature

    Robin



    ...Even if you're on the right track, you'll get run over if you just set there.
    {{ DiscussionBoard.errors[8125426].message }}
  • Profile picture of the author Michael71
    Never start ID's or class names with numbers!

    css parsing - What characters are valid in CSS class names? - Stack Overflow
    Signature

    HTML/CSS/jQuery/ZURB Foundation/Twitter Bootstrap/Wordpress/Frontend Performance Optimizing
    ---
    Need HTML/CSS help? Skype: microcosmic - Test Your Responsive Design - InternetCookies.eu

    {{ DiscussionBoard.errors[8126184].message }}

Trending Topics