-
-
Notifications
You must be signed in to change notification settings - Fork 3.9k
Description
This is about Bulma.
Overview of the problem
This is about the Bulma CSS framework
I'm using Bulma version [0.7.2]
I am sure this issue is not a duplicate
Description
The new version 0.7.2 seems to introduce a regression with images pulled right and a field
element.
It was introduced in #1749. I realize that it was introduced to explicitly address this behavior in a specific case, but as my example suggest, it wasn't always a problem.
Rather than adding a new property to the control
class, which is very context-dependent, i would have used is-clearfix
as a class in the example quoted on #1749
If the code won't be reverted, any advice on how should I change the markup?
This is the source of the following example:
<!DOCTYPE html>
<html lang="en">
<head>
<title>My custom Bulma website</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.1/css/bulma.min.css">
</head>
<body>
<div class="box">
<img class="is-pulled-right" src="https://bulma.io/images/css-book/css-in-44-minutes-book-cover.png" width="100px">
<h3 class="subtitle">Subtitle</h3>
<div class="field"><div class="control"><label class="checkbox"><input type="checkbox" value="on"><img class="filter-icon" src="https://bulma.io/images/index/js-frameworks.png" width="40px"><span>Text</span></div></label></div>
</div>
</body>
</html>
Because of the clear:both
in the control, we have the different behavior: