Re: [css-d] Elementary questioning about positioning a div

[Roger Roelofs]

Peter,

On Nov 25, 2006, at 12:54 PM, Jazzcreation wrote:

> In fact I want to make a 30px high strip divide into 4 divs, first  
> a 20px
> wide block, then a 100px wide block, then a block taking up the  
> rest of the
> width, with a 1px stripe on top.
>
> In trying to make up an example, I discovered that the following  
> code works.
> I didn't realise the RH divs would float up without specifically  
> being given
> "float" property (which stops them filling the width). Is this a  
> reasonable
> way of doing it?
>
>
> 
>   
>   
>   
>   
>   
>   
>   
>   
> 

What you have will work.  It can be simplified even more...


   
   
   


However, web pages aren't filled with empty colored squares.  The  
first question is really "What is the content/organization of this  
page?"  The answer to that question will influence the method you  
choose to get the page to look the way you want.  Web pages are  
amazingly flexible, and the user is ultimately in charge.  If we  
fight against the nature of the web, we pull our hair out, and our  
users go away unhappy.

-- 
Roger Roelofs
"Remember, if you’re headed in the wrong direction,
God allows U-turns!"
  ~Allison Gappa Bottke

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Elementary questioning about positioning a div

[Shlomi Asaf]

On 11/24/06, Jazzcreation <[EMAIL PROTECTED]> wrote
I'd like to position a div of a certain height (say 30px) so that it starts
20px from the left hand edge, and runs up to the right edge of the screen.

I normally try to figure out a way of doing this in css, then give up and
use a table, which provides a pretty straightforward solution.

Can anyone tell me what the css solution is?


i hope u meant that:

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
http://www.w3.org/1999/xhtml";>


Untitled Document

body{
margin:0
}
Div{
height:30px; border:1px solid; margin-left:20px
}




me starts 20px from the left



a div is a block level element. and this specific element expand its width
automatic to 100% of the flow width.
as u see, i margin left 20px the element, and i didn't have to give him
width, he took the place by himself.

NeoSwf
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Elementary questioning about positioning a div

[Chris Ovenden]

This should work:

div { height:30px; margin-left:20px }

If there are surrounding elements muddying the picture, the solution
might be different, though.

Chris

On 11/24/06, Jazzcreation <[EMAIL PROTECTED]> wrote:
> I'd like to position a div of a certain height (say 30px) so that it starts
> 20px from the left hand edge, and runs up to the right edge of the screen.
>
> I normally try to figure out a way of doing this in css, then give up and
> use a table, which provides a pretty straightforward solution.
>
> Can anyone tell me what the css solution is?
>
> Thanks,
> Peter
>
> __
> css-discuss [EMAIL PROTECTED]
> http://www.css-discuss.org/mailman/listinfo/css-d
> IE7 information -- http://css-discuss.incutio.com/?page=IE7
> List wiki/FAQ -- http://css-discuss.incutio.com/
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>


-- 
Chris Ovenden

http://thepeer.blogspot.com
"Imagine all the people / Sharing all the world"
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Elementary questioning about positioning a div

[~davidLaakso]

Jazzcreation wrote:
> I'd like to position a div of a certain height (say 30px) so that it starts
> 20px from the left hand edge, and runs up to the right edge of the screen.
>
> I normally try to figure out a way of doing this in css, then give up and
> use a table, which provides a pretty straightforward solution.
>
> Can anyone tell me what the css solution is?
>
> Thanks,
> Peter
I suppose it would depend on the particular situation. But here is one way:
:: css ::
body { background-color: #fff; color: #000; margin: 0; padding: 0; }
p { margin: 0; padding: 0; line-height: 1.8; }
#stuff { background-color: fuchsia; color: inherit; margin-left: 20px;}
:: html :
stuff
Best,
~dL


-- 
http://chelseacreekstudio.com/

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Elementary questioning about positioning a div

[Jazzcreation]

Thanks for your comments.

I must admit, I'd over-simplified the problem in an attempt to make it more
concise, rendering it meaningless.

In fact I want to make a 30px high strip divide into 4 divs, first a 20px
wide block, then a 100px wide block, then a block taking up the rest of the
width, with a 1px stripe on top.

In trying to make up an example, I discovered that the following code works.
I didn't realise the RH divs would float up without specifically being given
"float" property (which stops them filling the width). Is this a reasonable
way of doing it?



  
  
  
  
  
  
  
  


Regards,
Peter

-Original Message-
From: Roger Roelofs [mailto:[EMAIL PROTECTED]
Sent: 25 November 2006 15:48
To: [EMAIL PROTECTED]
Cc: css-d@lists.css-discuss.org
Subject: Re: [css-d] Elementary questioning about positioning a div


Peter,

On Nov 24, 2006, at 12:07 PM, Jazzcreation wrote:

> I'd like to position a div of a certain height (say 30px) so that
> it starts
> 20px from the left hand edge, and runs up to the right edge of the
> screen.

There are a bunch of ways to do this.  Probably the simplest is to
add margin-left: 20px; to the element.  Often it is easier to give
good advice in the context of a page you are working on.

--
Roger Roelofs
Datacomp Appraisal Services


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Elementary questioning about positioning a div

[Patrick James]

Jazzcreation wrote:

> I'd like to position a div of a certain height (say 30px) so that it starts
> 20px from the left hand edge, and runs up to the right edge of the screen.
> 
> I normally try to figure out a way of doing this in css, then give up and
> use a table, which provides a pretty straightforward solution.
> 
> Can anyone tell me what the css solution is?

Set the margin on the left to 20 px and on the right to 0?


-- 
Patrick




__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] Elementary questioning about positioning a div

[Jazzcreation]

I'd like to position a div of a certain height (say 30px) so that it starts
20px from the left hand edge, and runs up to the right edge of the screen.

I normally try to figure out a way of doing this in css, then give up and
use a table, which provides a pretty straightforward solution.

Can anyone tell me what the css solution is?

Thanks,
Peter

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/