Topic: Firefox Background Stretching (Page 1 of 1) Pages that link to <a href="https://ozoneasylum.com/backlink?for=25192" title="Pages that link to Topic: Firefox Background Stretching (Page 1 of 1)" rel="nofollow" >Topic: Firefox Background Stretching <span class="small">(Page 1 of 1)</span>\

 
chudzta
Bipolar (III) Inmate

From: Williamsburg, VA
Insane since: Aug 2002

posted posted 03-06-2005 05:25

So, I got into Firefox recently, and then saddened that my site's ranting centered text (that went off the page) had no background after one screen height's worth of text. The factor in that height of background was embedded in a css div property set to either 100% or i could give it a specific, huge number of px in order to sloppily fix the issue.

The code would be similar to...

#somename
{
width: 500px;
height: 100%;
position: relative;
}

In which, the above code worked (not sure of its validation but worked) in IE but failed to stretch in Firefox.

How can I get a div that stretches as far as it only needs to in Firefox?

Thanks - Ryandrew

DL-44
Maniac (V) Inmate

From: under the bed
Insane since: Feb 2000

posted posted 03-06-2005 15:41

You need to specify a height of 100% for both the HTML and BODY elements if you wish for anything inside of those elements to be 100%. As it stands, it *is* stretching the #somename to 100%....but 100% of the content, and not the viewport.

The issue then becomes, as you noted, that the styling ends at the end of the view port.
The only solution I have seen for this, is to add this to the CSS for the #somename:

display:table;

This thread at the GN does a good job of addressing this issue -
http://www.gurusnetwork.com/discussion/thread/2907/

I would also most likely take that 'position:relative;' out of there.



(Edited by DL-44 on 03-06-2005 15:45)

chudzta
Bipolar (III) Inmate

From: Williamsburg, VA
Insane since: Aug 2002

posted posted 03-07-2005 04:44

Hey DL, I didn't really have a whole lot of success with what was suggested.

I have elaborated more and given a link to the page and therefor the code as well at the GN... I replied to the post mentioned above. Thanks though, and hope someone will read the GN reply and gets this situation solved. - Ryandrew

Blaise
Bipolar (III) Inmate

From: London
Insane since: Jun 2003

posted posted 03-07-2005 17:59

Try removing height: 100% from you class

reisio
Obsessive-Compulsive (I) Inmate

From: Florida
Insane since: Mar 2005

posted posted 03-07-2005 20:26

that's necessary for when the contents of #textstuff does not reach to the bottom of the viewport

DL-44
Maniac (V) Inmate

From: under the bed
Insane since: Feb 2000

posted posted 03-07-2005 20:49

Gave the code a cursory look.

Would first recommend losing the positioning altogether. It tends to cause more problems than anything else.

Also, I don't see the 'display:table;' in there anywhere...that part is needed to make the styling extend past the view port.

You also have a bit of abuse of the H1 tag going on...

chudzta
Bipolar (III) Inmate

From: Williamsburg, VA
Insane since: Aug 2002

posted posted 03-26-2005 23:26

To whoever sent me a forum message form my very old website about ff background stretching, I changed the link in my info now.



Post Reply
 
Your User Name:
Your Password:
Login Options:
 
Your Text:
Loading...
Options:


« BackwardsOnwards »

Show Forum Drop Down Menu