Re: [WSG] 100% height block for XHTML 1.1 in FireFox and Opera

2006-10-09 Thread Tom Livingston 
 


On 10/7/06 5:00 AM, Âî›îí [EMAIL PROTECTED] wrote:

 Can i create block which minimum height 100% of browser work area?
 I create examle, wich work in IE. But in FF and Opera block's height is 0px;
 How i can get 100% height in other browser's ?

This works for me in all I test for for 100% height:

!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd;
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=UTF-8 /
title[Title]/title
style type=text/css

html, body{height:100%;}
#wrap{position:static; height:100%;}
#wrap2{position:relative; height:auto;}

/style
/head

body
div id=wrap
div id=wrap2
div id=header[header]/div
div id=content
  [content]
/div
/div
/div
/body
/html

Adjust style as needed for font, colors, etc. obviously. See it in action at
arobotics.com. Never did multiple bg images as you are trying.

HTH

-- 
Tom Livingston | Senior Multimedia Artist | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

[WSG] 100% height block for XHTML 1.1 in FireFox and Opera

2006-10-07 Thread ~davidLaakso 

wrote:


Problem:
Can i create block which minimum height 100% of browser work area?
I create examle, wich work in IE. But in FF and Opera block's height is 0px;
How i can get 100% height in other browser's ?

  

See these examples by Paul O'Brien:
http://www.pmob.co.uk/temp/mac3column.htm
http://www.pmob.co.uk/temp/2colmac.htm
Regards,
~dL

--
http://chelseacreekstudio.com/



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] 100% height block for XHTML 1.1 in FireFox and Opera

2006-10-07 Thread Joseph R. B. Taylor 

Âîðîí wrote:


Good time of day.

Problem:
Can i create block which minimum height 100% of browser work area?
I create examle, wich work in IE. But in FF and Opera block's height is 0px;
How i can get 100% height in other browser's ?

HTML

!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.1//EN 
http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd;
htmlheadtitle/title
meta http-equiv=Content-Type content=text/html; charset=windows-1251/
link rel=stylesheet href=css/styles.css type=text/css/
/head
body
div id=warning_block
   div id=top_left_bg_block
   div id=top_right_bg_block
   ...more block's...
   /div
   /div
/div
/body/html

CSS:

BODY{
margin:0px;
padding:0px;
width:100%;
min-width:100%;
background: #113689 url(../img/bg_gradient.gif) 100% 0px repeat-y;
height:auto !important;
height:100%;
min-height:100%;
}

#warning_block{
height:auto !important;
height:100%;
min-height:100%;
}

#top_left_bg_block{
height:auto !important;
height:100%;
min-height:100%;
background: url(../img/top_left_bg.jpg) 0px 0px no-repeat;
}

#top_right_bg_block{
height:auto !important;
height:100%;
min-height:100%;
background: url(../img/top_right_bg.jpg) 100% 0px no-repeat;
}

__

Yours sincerely. Raven.
Night folk studio.


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
 


You can also try:

html { height: 100%; }

Some browsers get remedied by adding that in.  Remember that 100% only 
applies to the visible view port not the height that the page (if 
longer) may be.


--
Joseph R. B. Taylor
Sites by Joe, LLC
http://sitesbyjoe.com
(609)335-3076
[EMAIL PROTECTED]



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
begin:vcard
fn:Joseph R. B. Taylor
n:Taylor;Joseph
org:Sites by Joe, LLC
adr:;;408 Route 47 South;Cape May Court House;NJ;08210;USA
email;internet:[EMAIL PROTECTED]
tel;work:609-335-3076
tel;cell:609-335-3076
x-mozilla-html:FALSE
url:http://sitesbyjoe.com
version:2.1
end:vcard

Re[2]: [WSG] 100% height block for XHTML 1.1 in FireFox and Opera

2006-10-07 Thread �� 
Good time of day.

JRBT You can also try:
JRBT html { height: 100%; }
JRBT Some browsers get remedied by adding that in.  Remember that 100% only
JRBT applies to the visible view port not the height that the page (if 
JRBT longer) may be.

Code bellow allow to set minimal width of #inner_block_1 to 100% of
viewport.
But there is also problem with #inner_block_2. It's height is auto.
Help me set minimal height of #inner_block_2 and inner blocks to 100%
of viewport.

HTML:

!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.1//EN 
http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd;
htmlheadtitle/title
meta http-equiv=Content-Type content=text/html; charset=windows-1251/
link rel=stylesheet href=css/styles.css type=text/css/
/head
body
div id=inner_block_1
div id=inner_block_2
 text and more blocks
/div
/div
/body/html

CSS:

HTML{
height: 100%; 
margin: 0; 
padding: 0;
}

BODY{
height: 100%;
margin: 0;
padding: 0;
background: #ff;
}

#inner_block_1{
min-height: 100%;
background-color:#00ff00;
}

* html #inner_block_1{
height: 100%;
}

#inner_block_2{
min-height: 100%;
background-color:#ff;
}

* html #inner_block_2{
height: 100%;
}

__

Yours sincerely. Raven.
Night folk studio.






***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] 100% height block for XHTML 1.1 in FireFox and Opera

2006-10-07 Thread �� 
Доброго времени суток.

~ Is this any closer?
~ http://www.chelseacreekstudio.com/height.html
No. It's the same...

But now i know the problem.

Background:
I whant create page with 4 background images in the corners and
gradient image beyond them.

We can use percent as height units while parent container height is
obviously defined.
But if we use height:auto;
than child of this block cannot use parents... (height:100% would not
work any more);

is there any solution ?
Is there any way to define height:auto only for mozilla and opera ?
(we use height:100%; only for IE)

Examle:

HTML:
htmlheadtitletitle/title
meta http-equiv=Content-Type content=text/html; charset=windows-1251/
link rel=stylesheet href=css/styles.css type=text/css/
/head
body
div id=top_left_bg_block
div id=top_right_bg_block
div id=bottom_left_bg_block
div id=bottom_right_bg_block
some content
/div/div/div/div
/body
/html

CSS:
HTML, BODY {
height:100%;
margin:0px;
padding:0px;
}
  
BODY{
background: #113689 url(../img/bg_gradient.gif) 100% 0px repeat-y;
}

#top_left_bg_block{
height:100%;
min-height:100%;
background: url(../img/top_left_bg.jpg) 0px 0px no-repeat;
}

#top_right_bg_block{
height:100%;
min-height:100%;
background: url(../img/top_right_bg.jpg) 100% 0px no-repeat;
}

#bottom_left_bg_block{
height:auto!important;
height:100%;
min-height:100%;
background: url(../img/bottom_left_bg.jpg) 0px 100% no-repeat;
}

#bottom_right_bg_block{
height:100%;
min-height:100%;
background: url(../img/bottom_right_bg.jpg) 100% 100% no-repeat;
}

-- 
С уважением, Ворон.



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] 100% height block for XHTML 1.1 in FireFox and Opera

2006-10-07 Thread ~davidLaakso 

Ворон wrote:

Доброго времени суток.

But now i know the problem.
  

I hope someone knows the answer :-) .

Background:
I whant create page with 4 background images in the corners and
gradient image beyond them.

We can use percent as height units while parent container height is
obviously defined.
But if we use height:auto;
than child of this block cannot use parents... (height:100% would not
work any more);

is there any solution ?
Is there any way to define height:auto only for mozilla and opera ?
(we use height:100%; only for IE)
  

Well, I'm over my head with this stuff, but this feeds mozilla (I guess):
htmlbody #outer{height:auto;}
and this is sometimes used to feed opera:
@media screen and (min-width: 0px){
body #outer{height:auto;}
} /*be even nicer to opera */
Best,
~dL


--
http://chelseacreekstudio.com/



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***