this css fixes the ever expanding image container bug in facebook albums(affects gecko 1.8)

copy the brownish text below in usercontent.css (edit>configuration>custom user-defined css)
-open usercontent.css in notepad, append css and save file

css code:

@-moz-document url-prefix(http://facebook.com/photo)
,url-prefix(http://www.facebook.com/photo){
#myphoto{top:1px!important;left:0px!important;float:none!important;position:absolute!important;max-height:580px!important}
.photo_container,#photo_container,#myphotolink{float:none!important;width:auto;position:absolute!important}
.comment_box{margin-top:24px!important}
*[class^="commentable_item comment_form"]{margin-top:-40px!important}
.photocaption_text{margin-top:600px!important;float:right!important}
#rightcolumn{margin-right:-172px!important;z-index:-1!important}
}

n.b. disabling js or creating a policy manager zone for facebook with js disabled fixes that bug and the css isn't needed since it's originally a js bug not a css one



Edited 1 time(s). Last edit at 06/12/2010 10:50PM by disrupted.

Quote
disrupted
this css fixes the ever expanding image container bug in facebook albums(affects gecko 1.8)

does it only affect gecko 1.8.x browsers? or can the CSS fix also work with Gecko 1.9.x based browsers?

it's not needed for 1.9 and should only be used in gecko 1.8. their js for navigating images(next previous) is not supported by 1.8 causing a visual bug in oncreasing the image container height and pushing the image to end of the container with the image navigator..the css fixes that problem by forcing the container to behave regardless of the js invoked and forcing an image position at the top of the container

Thanks for posting these css's. It's amazing how simple code can improve the experience of a website. or kill it.

Thak you for this script!

This css doesn't work with links such as:
http://www.facebook.com/home.php#!/photo.php?pid=XXXXXXXXXXXXXXXXXX

because in the css it's only used for
http://facebook.com/photo

I edited it just to apply it to the whole website, it seems to work

That's how it looks:

@-moz-document url-prefix(http://facebook.com)
,url-prefix(http://www.facebook.com){
#myphoto{top:1px!important;left:0px!important;float:none!important;position:absolute!important;max-height:580px!important}
.photo_container,#photo_container,#myphotolink{float:none!important;width:auto;position:absolute!important}
.comment_box{margin-top:24px!important}
*[class^="commentable_item comment_form"]{margin-top:-40px!important}
.photocaption_text{margin-top:600px!important;float:right!important}
#rightcolumn{margin-right:-172px!important;z-index:-1!important}
}

thank you very much ursal for the update..maybe me and you should work for them and fix them up :d.. i'll probably shut down the whole site

also works perfectly as a stylish style.

Quote

Styles

disable or edit visible stylesheet (css) content on a page. includes different stylesheets to easily find what elements are used on a page, their names and positions. also includes aardvark & xray site probing services to help you unravel the mystery behind web page design. click any paragraph, image, table or any other element of a web page to determine it’s HTML source, image dimensions and other properties.
menu entry: tools>styles>
extra notes: -
versions supported: 1.1.x - 1.5.x

Hi everyone. I think I might have found a better and easier solution.
I haven't tested for long, so...

Test it and let me know

The solution is a blocking filter:

"http://static.ak.fbcdn.net/rsrc.php/zCAOU/p/hash/*";

You can get ad blocker for k meleon here. And let me know...
http://adblockplus.org/en/kmeleon

copy the link url to get the filter on the previous message,

by the way the address is essentially this:

static.ak.fbcdn.net/rsrc.php/zCAOU/p/hash/*