Jo Ko Jo Ko - 3 months ago 11
React JSX Question

ReactJS: How to make <div/> float not affect the next <div/>?

I currently have:

<div style={{float:'left'}}>Left</div>
<div style={{float:'right'}}>Right</div>
<div>Below</div>


I was able to get
Left
and
Right
to be on the opposite ends like intended on the same line, but the
Below
is also affected, and floats to the left, right next to
Left
, even though float has not been defined for it.

So I was wondering how to keep
Below
on the next line, without being affected by the previous floats?

Answer

You should clear the last div. Try this:

<div style={{clear:'both'}}>Below</div>
Comments