css layers

css layers

am 05.06.2007 20:10:45 von enkara

Hi, I'm starting with php and I have a problem with layers. I want my
page to have four different parts: menu, header, tools and content.
I want to use layers, but I can't make them fit the page. In this page
you can see the result:

http://es.geocities.com/deumy/base.html

My question is: Why the layers don't fit the page? they leave blank
spaces! How do I have to do it?

I paste the code:

base.html:



<?php echo $this->escape($this->title); ?>
href="site.css" />











site.css:

#Content {
position:absolute;
width:85%;
height:80%;
z-index:4;
left: 15%;
top: 20%;
}

#Header {
position:absolute;
width:100%;
height:15%;
z-index:1;
left: 0px;
top: 0px;
background-color: #E1FF88;
}
#Menu {
position:absolute;
width:15%;
height:85%;
z-index:3;
top: 15%;
left: 0px;
background-color: #FFB18C;
}
#Tools {
position:absolute;
width:85%;
height:5%;
z-index:2;
left: 15%;
top: 15%;
background-color: #D8AFEB;
}

Thank you very much!!!!!!!!

Re: css layers

am 06.06.2007 01:18:22 von jmm-list-gn

enkara wrote:
> Hi, I'm starting with php and I have a problem with layers. I want my
> page to have four different parts: menu, header, tools and content.
> I want to use layers, but I can't make them fit the page. In this page
> you can see the result:
>
> http://es.geocities.com/deumy/base.html
>
> My question is: Why the layers don't fit the page? they leave blank
> spaces! How do I have to do it?
>
What are CSS "layers"?
What is the DTD (doctype)? It is missing.
What does "don't fit the page" mean? Blank spaces where!?
Why is there PHP code when this is a straight HTML document?

If the blocks of color are what you intend as a layout, there is no need
for any of that absolute positioning. Search for "2 column layout css".

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

Re: css layers

am 06.06.2007 19:32:19 von enkara

On 6 jun, 01:18, Jim Moe wrote:
> enkara wrote:
> > Hi, I'm starting with php and I have a problem with layers. I want my
> > page to have four different parts: menu, header, tools and content.
> > I want to use layers, but I can't make them fit the page. In this page
> > you can see the result:
>
> >http://es.geocities.com/deumy/base.html
>
> > My question is: Why the layers don't fit the page? they leave blank
> > spaces! How do I have to do it?
>
> What are CSS "layers"?
> What is the DTD (doctype)? It is missing.
> What does "don't fit the page" mean? Blank spaces where!?
> Why is there PHP code when this is a straight HTML document?
>
> If the blocks of color are what you intend as a layout, there is no need
> for any of that absolute positioning. Search for "2 column layout css".
>
> --
> jmm (hyphen) list (at) sohnen-moe (dot) com
> (Remove .AXSPAMGN for email)

Sorry, as you have noticed, my English isn't very good.

A thing I didn't say is that with Firefox works perfectly. It's in IE
that you can see the errors.
The doctype is html and css, I've put it.
I'm sorry, this concrete problem only concerns html, you are right,
but the original page has php code.
And layers... I think is what I'm doing. It's like frames but better I
think.

Sorry for my English. I hope that you can understand me :-S

Re: css layers

am 06.06.2007 19:38:37 von enkara

On 6 jun, 19:32, enkara wrote:
> On 6 jun, 01:18, Jim Moe wrote:
>
>
>
>
>
> > enkara wrote:
> > > Hi, I'm starting with php and I have a problem with layers. I want my
> > > page to have four different parts: menu, header, tools and content.
> > > I want to use layers, but I can't make them fit the page. In this page
> > > you can see the result:
>
> > >http://es.geocities.com/deumy/base.html
>
> > > My question is: Why the layers don't fit the page? they leave blank
> > > spaces! How do I have to do it?
>
> > What are CSS "layers"?
> > What is the DTD (doctype)? It is missing.
> > What does "don't fit the page" mean? Blank spaces where!?
> > Why is there PHP code when this is a straight HTML document?
>
> > If the blocks of color are what you intend as a layout, there is no need
> > for any of that absolute positioning. Search for "2 column layout css".
>
> > --
> > jmm (hyphen) list (at) sohnen-moe (dot) com
> > (Remove .AXSPAMGN for email)
>
> Sorry, as you have noticed, my English isn't very good.
>
> A thing I didn't say is that with Firefox works perfectly. It's in IE
> that you can see the errors.
> The doctype is html and css, I've put it.
> I'm sorry, this concrete problem only concerns html, you are right,
> but the original page has php code.
> And layers... I think is what I'm doing. It's like frames but better I
> think.
>
> Sorry for my English. I hope that you can understand me :-S- Ocultar texto de la cita -
>
> - Mostrar texto de la cita -

I didn't read the last part of your message. I don't want a 2 column
layout (that's the correct word I suppose), if I delete the
positioning, the results aren't what I want

Thank you!

Re: css layers

am 06.06.2007 20:52:35 von Bergamot

enkara wrote:
>>
>> >http://es.geocities.com/deumy/base.html
>>
> And layers... I think is what I'm doing. It's like frames but better I
> think.

Sorry, but you are misguided. "Layers" are an invention of Dreamweaver,
though based on an old Netscape idea. They don't really exist outside of DW.

Frames do have problems, but emulating them with CSS can be even worse.
You don't need all that positioning, and it will likely just get you
into trouble if you don't completely understand how the box model and
various positioning methods are *supposed* to work.

Even if you do understand them, you have to be careful how you use them
or the layout will still break. For example, in your test page you have
not accounted for any overflow conditions. So what will happen with a
long word in the left column, or in a small window, or with a large text
size? How will your layout adapt so it will still be usable?

What you have is really just a 2 column layout with a header. You might
want to reconsider Mr. Moe's advice about looking for a template.

--
Berg

Re: css layers

am 06.06.2007 21:11:25 von jmm-list-gn

enkara wrote:
>>
>> > If the blocks of color are what you intend as a layout, there is no need
>> > for any of that absolute positioning. Search for "2 column layout css".
>>
>> A thing I didn't say is that with Firefox works perfectly. It's in IE
>> that you can see the errors.
>> The doctype is html and css, I've put it.
>>
The preferred doctype is:
"http://www.w3.org/TR/html4/strict.dtd">

Insert the above before the tag. Using HTML 4.01 Strict offers
the greatest uniformity of presentation across browser implementations.
Validate your code at .
>
> I didn't read the last part of your message. I don't want a 2 column
> layout (that's the correct word I suppose), if I delete the
> positioning, the results aren't what I want
>
A 2 column layout, with a main header area, is exactly what you are
showing. The subheader in the Content block is trivial.
IE6 does not do absolute positioning all that well. I cannot say about IE7.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

Re: css layers

am 11.06.2007 18:48:46 von enkara

On 6 jun, 21:11, Jim Moe wrote:
> enkara wrote:
>
> >> > If the blocks of color are what you intend as a layout, there is no need
> >> > for any of that absolute positioning. Search for "2 column layout css".
>
> >> A thing I didn't say is that with Firefox works perfectly. It's in IE
> >> that you can see the errors.
> >> The doctype is html and css, I've put it.
>
> The preferred doctype is:
> > "http://www.w3.org/TR/html4/strict.dtd">
>
> Insert the above before the tag. Using HTML 4.01 Strict offers
> the greatest uniformity of presentation across browser implementations.
> Validate your code at .
>
> > I didn't read the last part of your message. I don't want a 2 column
> > layout (that's the correct word I suppose), if I delete the
> > positioning, the results aren't what I want
>
> A 2 column layout, with a main header area, is exactly what you are
> showing. The subheader in the Content block is trivial.
> IE6 does not do absolute positioning all that well. I cannot say about IE7.
>
> --
> jmm (hyphen) list (at) sohnen-moe (dot) com
> (Remove .AXSPAMGN for email)

ok, I'll try it. Thank you!