Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > css layers

Reply
Thread Tools

css layers

 
 
enkara
Guest
Posts: n/a
 
      06-05-2007
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:

<html>
<head>
<title><?php echo $this->escape($this->title); ?></title>
<link rel="stylesheet" type="text/css" media="screen"
href="site.css" />
</head>

<body>
<div id="Header"></div>
<div id="Menu"></div>
<div id="Tools"></div>
<div id="content"></div>
</body>
</html>


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!!!!!!!!

 
Reply With Quote
 
 
 
 
Jim Moe
Guest
Posts: n/a
 
      06-05-2007
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)
 
Reply With Quote
 
 
 
 
enkara
Guest
Posts: n/a
 
      06-06-2007
On 6 jun, 01:18, Jim Moe <(E-Mail Removed)> 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

 
Reply With Quote
 
enkara
Guest
Posts: n/a
 
      06-06-2007
On 6 jun, 19:32, enkara <(E-Mail Removed)> wrote:
> On 6 jun, 01:18, Jim Moe <(E-Mail Removed)> 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!

 
Reply With Quote
 
Bergamot
Guest
Posts: n/a
 
      06-06-2007
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
 
Reply With Quote
 
Jim Moe
Guest
Posts: n/a
 
      06-06-2007
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:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

Insert the above before the <html> tag. Using HTML 4.01 Strict offers
the greatest uniformity of presentation across browser implementations.
Validate your code at <http://validator.w3.org/>.
>
> 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)
 
Reply With Quote
 
enkara
Guest
Posts: n/a
 
      06-11-2007
On 6 jun, 21:11, Jim Moe <(E-Mail Removed)> 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:
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
> "http://www.w3.org/TR/html4/strict.dtd">
>
> Insert the above before the <html> tag. Using HTML 4.01 Strict offers
> the greatest uniformity of presentation across browser implementations.
> Validate your code at <http://validator.w3.org/>.
>
> > 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!

 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
HTML CSS layers problem Bob HTML 3 07-02-2008 07:30 PM
Subnets between core and access/distribution layers & routing between layers J Cisco 0 12-13-2006 08:38 PM
Abstraction Layers And Their Importance Silverstrand Front Page News 0 01-31-2006 04:48 AM
css persistent layers shank HTML 5 10-24-2003 09:16 PM
css layers Stijn Goris HTML 1 08-15-2003 04:24 PM



Advertisments