search

Dogfalo / materialize

Materialize, a CSS Framework based on Material Design
https://materializecss.com
MIT License
38.86k stars 4.74k forks source link

Materialize breaks polldaddy polls #3251

Closed LCallaghan84 closed 7 years ago

LCallaghan84 commented 8 years ago

Materialize removes the radio buttons from polldaddy polls

joglr commented 8 years ago

Materialize is not really compatible with using other modules that use form elements. polldaddy, leaflet and others are examples of this. This is due to the way materialize works. Styling are added to input elements by default and does not require a class to be added to most form elements. The browser-default class remove some of this behaviour, but it doesn't seem to work with checkboxes, for example (I just briefly tried to add the browser-default class to a checkbox input. This is a problem I am also facing, while using the leaflet layer control with materialize. To solve my issue, I did some custom styling to the leaflet checkboxes, to remove the materialize default styles from elements that are not supposed to be materialized.

.leaflet-control-layers-list label {
    font-size: 1rem;
}

:not(body)[class*=leaflet] [type="checkbox"],
:not(body)[class*=leaflet] [type="checkbox"]:checked
[class*=leaflet] [type="checkbox"]:not(:checked) {
    position: static;
    opacity: 1; 
}

I think fixing this would require a lot of work. For now you can probably do something like I did to solve the issue.