[WSG] CSS Layout issue - height attribute
Hello all,
I am about to go insane
I am creating a website for a client that has, as its main visual impact
feature, a drop-shadowed background. This background was originally designed
to dynamically resize to accomodate all text-sizes (I've attached a small
screen shot).
ie. using the 'background-image: url('1pxTall.jpg ')' and
'background-repeat: y' attributes the background would repeat as many of
these 1px tall images as it would need to perfectly contain the page
content.
My problem now is that I have had to give the div id=container of this
background-image a*height - because without it, the it automatically sets to
0the content stays in the same spot on the page but the background-image
shoots upwards - like a vertical blind that has been yanked too hard and
just flies up.
Now, before you suggest something like giving the container a value for
height based on text-size: like 38em, I tried this exact value for the
container and it looks fine for the normal text size on FF and IE but if you
increase the text size, some of the page material falls outside the
designated area - doesn't look very good. And, in general, I'd like the
background-image to perfectly complement the page material no matter what
size...
Is there a way I can either give the container a height value or not so that
it will 'contain' all content within AND apply the proper background effect?
And...what is making this container appear empty, without a height value,
when it contains all page content???
--
Christian Fagan
Fagan Design
0432 220 579
[EMAIL PROTECTED]
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**attachment: screenshot.jpg
Re: [WSG] CSS Layout issue - height attribute
On 7/26/06 10:12 AM, Christian Fagan [EMAIL PROTECTED] wrote: Is there a way I can either give the container a height value or not so that it will 'contain' all content within AND apply the proper background effect? And...what is making this container appear empty, without a height value, when it contains all page content??? Are you using absolute positioning of the elements inside container? If so, then container doesn't 'see' any content and thinks it's empty. If this is the case, try floats (and clear them) or relative positioning. HTH -- Tom Livingston | Senior Multimedia Artist | Media Logic | ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] CSS Layout issue - height attribute
Hello, as peter had said it is better to see the markup.
Some times a give to body the background in case of 100% width layouts.
If you put:
html: 100%
May be you resolve some issues in no MSIE browsers.
like http://artideias.com/css/height100.html , only with html: 100%
you can see height i blocks.
If i see what you need would be better,
Cheers,
Gaspar
On 27/07/2006, at 12:12 AM, Christian Fagan wrote:
Hello all,
I am about to go insane
I am creating a website for a client that has, as its main visual
impact feature, a drop-shadowed background. This background was
originally designed to dynamically resize to accomodate all text-
sizes (I've attached a small screen shot).
ie. using the 'background-image: url('1pxTall.jpg ')' and
'background-repeat: y' attributes the background would repeat as
many of these 1px tall images as it would need to perfectly contain
the page content.
My problem now is that I have had to give the div id=container
of this background-image a*height - because without it, the it
automatically sets to 0the content stays in the same spot on
the page but the background-image shoots upwards - like a vertical
blind that has been yanked too hard and just flies up.
Now, before you suggest something like giving the container a value
for height based on text-size: like 38em, I tried this exact value
for the container and it looks fine for the normal text size on FF
and IE but if you increase the text size, some of the page material
falls outside the designated area - doesn't look very good. And, in
general, I'd like the background-image to perfectly complement the
page material no matter what size...
Is there a way I can either give the container a height value or
not so that it will 'contain' all content within AND apply the
proper background effect? And...what is making this container
appear empty, without a height value, when it contains all page
content???
--
Christian Fagan
Fagan Design
0432 220 579
[EMAIL PROTECTED]
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
screenshot.jpg
--
Peter Dominic Ryan | raycity* : new media solutions : proven
[EMAIL PROTECTED] | http://raycity.com | mb: 0419 229 738
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
--
Make it simple for the people
--
http://www.artideias.com
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
