going beyond a couple of <br />'s

cosmicbdog · #1 May 23rd, 2007, 11:27

I'm still getting my head around css and am wondering how to place a DIV of a certain width, that whatever height it takes up it doesn't have anything on a certain side, or either side of...

My hack is generally something like:

Code: Select all

<div style="float: left; clear: right; margin-left: 18px; font-size: 9pt; width: 300px;">Enter a numerical value such as 9px or 2em to add more margin between the primary image and copy. Negative numerals such as -9px or -2em will decrease the margin.</div><br /><br /><br />
// enter here stuff that goes under the br'd div

have i misunderstood the css 'clear' usage? keep clear everything right of this is my understanding... looking to the web consortium now! any tips though?

Ryan Fait · #2 May 23rd, 2007, 11:32

Code: Select all

.box {
  width: 300px;
  margin: 0 auto;
}

Code: Select all

<div class="box"></div>

karinne · #3 May 23rd, 2007, 12:26

To add to what Ryan posted, if you want to clear a space "beneath" the box, then add margin-bottom:

Code: Select all

.box {
  width: 300px;
  margin: 0 auto;
  margin-bottom: 10px;
}

Code: Select all

<div class="box"></div>

BTW, the margin: auto; will center your box.

cosmicbdog · #4 May 23rd, 2007, 14:26

ahh the margin auto eh...

auto has actually only just become an ingredient in my recipe book. i use margin as much as any other tool and only in the last week have i seen auto used to center.

imo, up until recently, centering has been a real hassle.

/bows down on his knees

thank you for the teaching

moojoo · #5 May 23rd, 2007, 17:50

to correct:

.box {
width: 300px;
margin: 0 auto 10px auto; /* top, right, bottom, left */
}

Ryan Fait · #6 May 24th, 2007, 00:25

I must've been in a hurry. Moojoo's could also be written as margin: 0 auto 10px; for the same effect. Shorthand is nice.

cosmicbdog · #7 May 24th, 2007, 07:15

top right bottom left top right bottom left top right bottom left

thanks for the tips. i like the shorthand

Ryan Fait · #8 May 24th, 2007, 10:51

For not shorthand, just think of it as North East South West

cosmicbdog · #9 May 24th, 2007, 11:09

and to remember North East South West try Never Eat Soggy Wheatbix which may not work unless you are australian and know what Wheatbix are.

Ryan Fait · #10 May 24th, 2007, 11:27

In the US it's Never Eat Soggy Wheat, so it's basically the same thing. What are Wheatbix?

karinne · #11 May 24th, 2007, 12:55

Or just TRouBLed

Top
Right
Bottom
Left

cosmicbdog · #12 May 24th, 2007, 13:10

hahaha thats cool.

took me a while to work out what you were on about but you went back to the Top Right Bottom Left thing.

wheat bix are like wheat bricks. 1cm x 3cm x 6cm. You get a whole bunch stacked in a box and you slam a few in the bowl and pour the milk.

is your wheat not bix?

VanessaJW · #13 May 24th, 2007, 17:43

In England we say Never Eat Shredded Wheat (which I think works in the US, Canada and Australia too?). We do also have the Wheatbix that you referred to, only we call them Weetabix, and that's right, you shouldn't eat them soggy, yuck!

christoefar · #14 May 24th, 2007, 19:15

You can also use Naughty Elephants Squirt Water!

And I happen to like my weetabix soggy, with lots of sugar, possibly warm milk!

moojoo · #15 May 24th, 2007, 19:55

I like to think of it like a clock. 12, 3, 6, 9. Works for me anyway. but I think in images, bleh probably why I suck so bad at math.

As for going off topic I only have one pearl of wisdom to share.

Never date a woman who has more children than teeth.

karinne · #16 May 25th, 2007, 13:08

Closing thread. If you have something on-topic to add, PM me. I re-open it.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
a couple of problems	ukstoner	Web Page Design	1	Apr 29th, 2008 13:45
A couple of issues I need help with please	Johnathan	Web Page Design	7	Mar 15th, 2008 17:57
CSS Help, A couple things.	Dazer	Web Page Design	5	Mar 8th, 2007 16:26
A couple of bugs	Ryan Fait	Web Page Design	6	Jan 12th, 2007 23:32
A couple of articles	Ryan Fait	Web Page Design	2	Oct 20th, 2006 07:57

		Webforumz.com > Main Forums > Design Your Website > Web Page Design
going beyond a couple of <br />'s