JSFiddle - React, Tailwind, and code Playground

by smlombardi

HTML

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>susy1</title>
	<link rel="stylesheet" href="stylesheets/screen.css" media="all">
</head>
<body>
	<div class="container">
		<div class="top-row">
			<div class="headline">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam possimus tempore molestias fugiat quaerat voluptas vero? Iure obcaecati soluta modi! Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem nemo officiis dolor itaque aliquid libero illo eos tempore sed sapiente iusto reprehenderit possimus commodi fuga esse illum quia nisi ipsa optio totam maxime. Reprehenderit excepturi officiis eveniet omnis voluptates repudiandae rem ducimus accusantium minus maxime! Eveniet distinctio assumenda atque dicta!
			</div>
			<div class="ad">
				<img src="http://placehold.it/300x250" alt="">
			</div>
		</div>
	</div>
</body>
</html>

CSS

/* -------------------------------------------------------------------------*/
/* Layout */
/* line 9, ../sass/screen.scss */
.container {
  *zoom: 1;
  max-width: 59em;
  _width: 59em;
  padding-left: 1em;
  padding-right: 1em;
  margin-left: auto;
  margin-right: auto;
}
/* line 38, ../../../../../Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
.container:after {
  content: "";
  display: table;
  clear: both;
}

/* line 18, ../sass/screen.scss */
.ad {
  width: 32.20339%;
  float: right;
  margin-right: 0;
  #margin-left: -1em;
  display: inline;
  min-width: 300px;
}

/* line 23, ../sass/screen.scss */
.headline {
  margin-right: 20em;
}


/*
.container {
  @include container;
  //@include susy-grid-background;
}
idth: columns-width(4); // you can use any width you want.
// }
.ad {
  @include span-columns(4 omega);
  min-width: 300px; // you can use any width you want.
}

.headline {
  margin-right: columns-width(4) + $gutter-width;
 }
*/