Jump to content
Sign in to follow this  
ilonka65

Create space after div

Recommended Posts

ilonka65

Hello I've just created some colour text boxes on the site using the following html & css code... #div3 { float:left; width:920px; padding: 5px; border: 1px solid #cccf98; background-color:#fbfce0; } Then html is like this:

example paragraph
It seems to be working ok except that the next line of text underneath the div sits too closely. I've tried using the following tags to create a space but nothing is working...

(around next sentence/heading)

/h4>(around next sentence/heading) Maybe my div code is wrong or is there a different tag required?

Share this post


Link to post
Share on other sites
Danny
Hi, Try adding this to your CSS code: [code]margin-bottom: 1.5em;[/code]

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
toasthosting
Hi - that should be a fairly simple one to sort out. You simply need to add some code to your div3 telling it to add some space to the bottom. Something like this should do it: margin-bottom: 10px; Just add that to the CSS for your div3. I tested it using Firebug and it added a bit of space - you might need more. Actually, looking at your site, can I suggest you think about adding more white space to the left, right, top and bottom? Compare your home page to this page that you're reading now - look at the amount of space between the posts and the edge of the posts box. It makes things much easier to read. You've got quite a lot of text on that page, and I think it will benefit from some space. You'd do that with a mixture of padding: and margin: (which you can fine-tune by using margin-left, margin-right etc.) Do you use the "firebug" extension for Firefox? It's fantastic for letting you look at the actual effect of your CSS - it's how I just tested the margin-bottom setting: You can enter CSS into a document and it'll change it, just for you (you would still have to go in and alter the code to make it permanent). I ask cos if you wanted to increase your white space, there are 2 or 3 different CSS selectors you will need to play with, which people here could help you with, but it's really fun to play for yourself :) -tony

Share this post


Link to post
Share on other sites
toasthosting
Danny's code is better - he used "em" which is a more flexible unit of measurement - it will mean the spacing can grow and shrink according to the other sizes you use.

Share this post


Link to post
Share on other sites
Jenny
If you need CSS help, make sure you've downloaded [url="http://www.getfirebug.com"]Firebug for Firefox[/url] and check out [url="http://www.w3schools.com/"]W3 Schools[/url] for more info. Also please be sure to watch our Firebug video tutorial [url="http://www.pagelines.com/wiki/Custom_CSS"]here[/url].

Jenny :: Web designer at Simple Mama (follow me at @simplemamacom)

Check out Share Me, a social sharing add-on for DMS that is super simple to set up.

Share this post


Link to post
Share on other sites
ilonka65
Hello Thank you all for your answers, at the moment, nothing will save into the custom css field, I'm not sure why as my other site is working ok. I'll try it again later:)

Share this post


Link to post
Share on other sites
Danny
Hi, What do you mean nothing is saving in the CSS rules area ?

Please search our forums, before posting!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×