Skip to content


Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP


Float helper classes #1046

wants to merge 1 commit into from

4 participants


I want to propose adding two new non-semantic helper classes

    float: left;
    float: right;

this helps you do things easier and quicker like:

<div class='clearfix'>
    <div class='item left'>

    <div class='item right'>


This helps you prototype faster.


1) better add them to non semantic helpers imo (im not a semantic freak though, i could be wrong)

2) you should try to avoid floating elements as much as possible.


This has been suggested in the past but the structure of the document should not be impacted by what CSS layout method you use. This goes against the use of modular replicable CSS we recommend.

@nimbupani nimbupani closed this

thanks, it was worth trying


@nimbupani Is there such thing as a guide or written standard that the project is following? I would like to read and better understand so I can make better proposals, or at least some that make better sense.


We do not have a guide, but the wiki page for css documents why these declarations are included. Searching over closed issues, would also help you find rationale for why some declarations did not make through.


thank you @nimbupani I'll take a look


I'd never add non-semantic helper classes in place of a single style attribute. You might as well write:

<div class='clearfix'>
    <div class='item' style="float:left;">

    <div class='item' style="float:right;">


You're only made to believe that you're not applying inline styling to your markup by using classes. Construct your page with grids, anyway. ;)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
This page is out of date. Refresh to see the latest.
Showing with 3 additions and 1 deletion.
  1. +3 −1 css/style.css
4 css/style.css
@@ -269,7 +269,9 @@ td { vertical-align: top; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
+/* Float helpers */
+.left { float: left; }
+.right { float: right; }
/* ==|== print styles =======================================================
Print styles.
Something went wrong with that request. Please try again.