Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
File: lightbox2/css/lightbox.css
Line: 43
Fragment: *left: 0%;
My suggestion is to delete this line to avoid validator warning.
Comment | File | Size | Author |
---|---|---|---|
#26 | lightbox2-6.11-css3-validation.patch | 295 bytes | attheshow |
Comments
Comment #1
xG3n1uS CreditAttribution: xG3n1uS commentedIt's very strange, I have Lightbox on two neraly similar websites.
Page1: CSS-Validation = OK
Page2: CSS-Validation = same as issue above !
What will happen, if I delete the line with *left: 0%; ???
What does this line do ???
Comment #2
stella CreditAttribution: stella commentedIt will prevent the lightbox appearing in the correct position in IE.
Comment #3
Zielu CreditAttribution: Zielu commentedHi Stella!
So why not use two CSS files, one named styles-ie.css and using it conditionally to avoid validator warnings in less problematic browsers?
Comment #4
TheresaB-1 CreditAttribution: TheresaB-1 commentedIt seems I made duplicate issue with my post http://drupal.org/node/453512 I have since removed the
*left: 0%;
and that fixed that error with only this error remaining:168 #overlay_default Property opacity doesn't exist in CSS level 2.1 but exists in [css3] : 0.6
I was also getting 200+ warnings in the W3C validator even of Drupal core module css files. But when I submitted each individually in the validator they showed now errors. So being inquisitive I commented out
and now my site is completely valid and ALL of the warnings are gone.
So now my question is what is
used to support what browsers?
Comment #5
daemon CreditAttribution: daemon commentedIt seems to only affect the position of the loader icon, could anyone confirm?
Applied to this piece of code:
<div id="loading"><a href="#" id="loadingLink"></a></div>
Comment #6
stella CreditAttribution: stella commentedYes it only affects the position of the loading icon
Comment #7
daemon CreditAttribution: daemon commentedDo you think there is another way to achieve the desired result? Centered loader.
I tried but without any success, we could reach to an expert in CSS or a CSS forum if we can extract any parent elements that affect this.
Comment #8
hefox CreditAttribution: hefox commentedAdditional validation error
This property was introduced in #419204: IE image resizing patch
Comment #9
grn CreditAttribution: grn commentedIf you wan't the IE css star hack use it in the proper way, like this:
I did not test it, but it should work.
Thanks for your time.
Comment #10
LEalex CreditAttribution: LEalex commentedCan anyone confirm (#9)?
[EDIT]
This does not work, firefox used left:0%...
Comment #11
grn CreditAttribution: grn commentedHmm, try the following.
For IE 4-6:
And IE 7
*+html #loading {
left: 0%;
}
Not tested though...
source: http://en.wikipedia.org/wiki/CSS_filter
Comment #12
Pomliane CreditAttribution: Pomliane commentedSubscribing.
Comment #13
PI_Ron CreditAttribution: PI_Ron commentedIm also getting validation issues with the lightbox module:
Sorry! We found the following errors (3)
URI : http://website/sites/all/modules/lightbox2/css/lightbox.css?W
43 #loading Parse Error *left: 0%;
44 #loading Parse Error }
168 #overlay_default Property opacity doesn't exist in CSS level 2.1 but exists in : 0.6 0.6
Comment #14
pumpkinkid CreditAttribution: pumpkinkid commentedDoes anyone know if this * issue causes problems with css optimization? Trying to isolate an issue for a friend of mine...
Comment #15
matteogeco CreditAttribution: matteogeco commentedSubscribing.
Comment #16
vkr11 CreditAttribution: vkr11 commentedsubscribe, break the theme in IE
Comment #17
dazweeja CreditAttribution: dazweeja commentedI agree with #3 - use IE conditional comments and valid CSS in preference to invalid CSS hacks. You could argue that conditional comments are a bit hacky because only one vendor has implemented them but they a) mean that both your HTML and CSS validate, b) allow the dev to specifically target problematic IE versions, and c) won't break in the future (because of point b) whereas hacks like the star hack are much more fragile.
Comment #18
yan CreditAttribution: yan commentedI also get the errors with
*left: 0%;
andopacity: 0.6;
. #9 solves the first one. Deleting the second one makes the loader appear on the left side (in Firefox).Comment #19
yan CreditAttribution: yan commentedI don't know about the IE part, but in Firefox, using css from #11 and deleting
opacity: 0.6;
makes the css validate and work as intended.Comment #20
Balbo CreditAttribution: Balbo commentedsubscribing.
Anyone can answer #4 asking what browser is
opacity: 0.6;
for?Comment #21
John Kenney CreditAttribution: John Kenney commentedSubscribing.
Still getting CSS errors
25 #loading Parse Error ;*left:0%;
25 #loading Parse Error ;}
26 #lightboxImage Property -ms-interpolation-mode doesn't exist : bicubic bicubic
Balbo, every modern browser except Internet Explorer supports opacity, that part validates as CSS3.
Comment #22
enkara CreditAttribution: enkara commentedThe same errors as 21. Is anyone able to give instructions to solve them in the most used browsers? Thank you!
Comment #23
dazweeja CreditAttribution: dazweeja commented@enkara, comment #11 solves the first two errors and is valid CSS. Regarding the other two, it's more contentious as to whether CSS3 and vendor-specific properties are really "errors". If you don't consider using a CSS3 property an "error" then you would consider this "error" a limitation of the W3C CSS Validator. I choose to use conditional comments for <IE6 and IE7 - so I only see the CSS3 "error" which I can live with - but many people prefer CSS hacks.
@stella, is it possible to change the CSS to include #11 which validates?
Comment #24
alexbk66- CreditAttribution: alexbk66- commentedsubscribing
Comment #25
yukare CreditAttribution: yukare commentedIf someone provides a patch for this, i can commit.
Comment #26
attheshow CreditAttribution: attheshow commentedHere's a patch for #11.
There's still the issue with the invalid code -ms-interpolation-mode: bicubic, but I'm not sure if that can safely be removed.
Comment #27
Prancz_Adam CreditAttribution: Prancz_Adam commentedSubscribe.
I'm working on make the css file valid, but any of my attempts case error in functionality.
I'm using Google Chrome now and the problematic
*left: 0%;
is necessary to work it correctly:-(Anyway I have many-many problems with different drupal modules when I want to make valid websites.