View Full Version : CSS spacing issue

05-24-2009, 07:02 AM
Hi all,

I am styling a very basic div with some very basic CSS but running into some problems. By profession, I am a print designer, so excuse my lack of appropriate terminology.

I have a class I want a "space after" before the next item shows inside the div. I am familiar with the "margin-bottom: 10px;" style, but it is not working. It's strange because if it set to "margin: 10px;" the left and right get a 10 pixel margin, but neither the top or bottom get what i want (I actually only want to target the bottom). I'm assuming I just have a conflicting style that's overriding what I'm after, but can't figure it out.

Here are the live URL's:

HTML: http://www.brandonknowlden.com/papermusic/index2.html

CSS: http://www.brandonknowlden.com/papermusic/CSS/newSite.css

Any help would be much appreciated.

05-24-2009, 01:01 PM
Learn about the difference between inline elements and block-level elements. To answer your question: top and bottom margins don’t work on inline elments. It would be more appropriate to use heading elements anyway since these yellow things are basically headings but you aren’t currently marking them up as such.

And also learn to use lists (http://htmldog.com/guides/htmlbeginner/lists/) when they are appropriate. The secret of great websites is at first semantic code (http://boagworld.com/technology/semantic_code_what_why_how/). The styling is second only.

05-24-2009, 01:47 PM
This site (http://www.maxdesign.com.au/presentation/inline/) may be of use to you.

Many more here. (http://exitfegs.co.uk/Sources.html)


05-24-2009, 06:06 PM
will look into it, thanks guys, much appreciated.