Join GitHub today
GitHub is home to over 20 million developers working together to host and review code, manage projects, and build software together.
Two lines in reset.less break the isotope library. #6541
Is there any CSS that can be applied to override this default for img objects? I tried setting the width and height for the images in the css, but that had no effect.
referenced this issue
Jan 11, 2013
Unfortunately, we won't be removing those at this time. They are necessary for the responsive image feature to work, and a few frameworks I know implement them this way. If there is a better way to do them, we can discuss that, but as it stands now, there is no way to override them aside from explicit dimensions via CSS (not HTML attributes).
Only option would be to override it in your own CSS (e.g., something like
Inlining this in the CSS worked, like this:
In fact, I also tested Isotope without using the width and height attributes, like this:
And that worked fine! Any recommendation if it's better to only specify the CSS?
I was able to very easily test this without bootstrap (or bootstrap 2.0) by using this CSS:
It seems that the width and height in the CSS do override the image properties, and before the images get loaded, the browser does not know how much space to allocate, and then, even after the images load, the spacing is still wrong, at least with Isotope. Inlining the style does workaround the issue. I think I tried using regular styles, but that didn't seem to work, but I may have had a CSS priority issue. Any way, since the image size is laid out with the image properties, it's rather natural to put in this tiny bit of inline CSS. I hope we eventually find a better solution, as this will surely affect others when upgrading.
Or at least this should be documented that one needs to use the inline style for the width and height of the image rather than the properties.