Permalink
Browse files

Fixing hr bottom margin by setting to 17px

  • Loading branch information...
1 parent 5d113e9 commit 9d29d1e45d23d7b45881840b31460527323f75ff @Montoya Montoya committed Apr 3, 2011
Showing with 493 additions and 3 deletions.
  1. +1 −1 blueprint/screen.css
  2. +1 −1 blueprint/src/grid.css
  3. BIN debug.zip
  4. +61 −0 debug/README.textile
  5. +307 −0 debug/debug.css
  6. +122 −0 debug/debug.html
  7. +1 −1 lib/blueprint/grid.css.erb
View
@@ -258,7 +258,7 @@ input.span-24, textarea.span-24 {width:938px;}
div.prepend-top, .prepend-top {margin-top:1.5em;}
div.append-bottom, .append-bottom {margin-bottom:1.5em;}
.box {padding:1.5em;margin-bottom:1.5em;background:#e5eCf9;}
-hr {background:#ddd;color:#ddd;clear:both;float:none;width:100%;height:1px;margin:0 0 1.45em;border:none;}
+hr {background:#ddd;color:#ddd;clear:both;float:none;width:100%;height:1px;margin:0 0 17px;border:none;}
hr.space {background:#fff;color:#fff;visibility:hidden;}
.clearfix:after, .container:after {content:"\0020";display:block;height:0;clear:both;visibility:hidden;overflow:hidden;}
.clearfix, .container {display:block;}
View
@@ -249,7 +249,7 @@ hr {
float: none;
width: 100%;
height: 1px;
- margin: 0 0 1.45em;
+ margin: 0 0 17px;
border: none;
}
View
BIN debug.zip
Binary file not shown.
View
@@ -0,0 +1,61 @@
+h2. Debugger
+
+version: _v0.1.3_ ^(beta)^
+
+* Gives you a safe rapid prototyping environment
+* Helps you avoid misuse of Blueprint classes
+
+Guaranteed to work in the following browsers...
+* Firefox 1.0+
+* Opera 7.0+
+* Konquerer 3.4+
+* Safari 1.2+
+...and won't work in IE due to missing support for +outline+
+
+
+----------------------------------------------------------------
+h3. Credits
+
+_author:_ Created by Franz Josef Kaiser "say hello code!":http://say-hello-code.com
+
+
+----------------------------------------------------------------
+h3. Usage
+
+* Make a copy of debug.html and give it a unique name for your test (for example, debug-test1.html)
+* Adjust the <head> of this debug environment page to your needs:
+* Uncomment the plugins you want to use in your page.
+** _optional_ only needed for the mailing list: describe your goals, trials & errors in the head container.
+* Add your basic html structure (div, h1-h6, p, span, a).
+* Add some "lorem ipsum" dummy text and sample IMGs to your html (search for lorem ipsum, there are lots of resources).
+* Add your Blueprint classes to the structure.
+* Uncomment the css/html debugger stylesheet in the head.
+* Open the sample in your browser.
+** _optional_ if you see elements outlined, you've forgotten declarations or added bad classes. In this case take a look at the head of the debugger plugin to check color codes & find out what exactly went wrong (it's easy).
+* Basic structure: _*done*_
+* Now you can add your own styles in a separate stylesheet to the <head> section and develop further.
+
+
+----------------------------------------------------------------
+h4. Changelog
+
+_v0.1 (alpha)_
+* first version
+** a basic html page structure
+** debugger offers outlining of classical misstakes
+
+_v0.1 (beta)_
+* debugger now offers help for missing declarations
+** dev page reworked to split between description & content
+
+_v01.1 (beta)_
+* bugfix: colborder & border were missing dot in front of class
+
+_v01.2 (beta)_
+* switched to textile mark-up file for readme to inherit bp core
+
+_v01.2.1 (beta)_
+* tried to fix textile mark-up for readme
+
+_v01.3 (beta)_
+* switched pathes for all style-links in the head of blueprint.html to work out of the box from the debug plugin directory.
View

Large diffs are not rendered by default.

Oops, something went wrong.
View
@@ -0,0 +1,122 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html charset=UTF-8" />
+ <title>Insert title here</title>
+
+ <meta name="author" content="Franz Josef Kaiser - http://say-hello-code.com" />
+ <meta name="license" content="Inherited from the Blueprint CSS framework (Modified MIT)" />
+ <meta name="version" content="0.1-beta" />
+
+ <!-- Compressed -->
+ <link rel="stylesheet" id="uncomp-core-screen" href="../blueprint/screen.css" type="text/css" media="screen" />
+ <link rel="stylesheet" id="uncomp-core-print" href="../blueprint/print.css" type="text/css" media="print" />
+ <!--[if lte IE 8]>
+ <link rel="stylesheet" id="uncomp-core-ie" href="../blueprint/ie.css" type="text/css" media="screen" />
+ <![endif]-->
+
+ <!-- Uncompressed
+ you can un-comment these separate stylesheets in place of the compressed ones, just make sure to
+ comment-out the compressed ones
+ <link rel="stylesheet" id="comp-src-reset" href="../blueprint/src/reset.css" type="text/css" media="screen" />
+ <link rel="stylesheet" id="comp-src-grid" href="../blueprint/src/grid.css" type="text/css" media="screen" />
+ <link rel="stylesheet" id="comp-src-forms" href="../blueprint/src/forms.css" type="text/css" media="screen" />
+ <link rel="stylesheet" id="comp-src-typo" href="../blueprint/src/typography.css" type="text/css" media="screen" />
+ <link rel="stylesheet" id="comp-src-print" href="../blueprint/src/print.css" type="text/css" media="print" />
+ -->
+
+ <!-- Plugins
+ these are core plugins included with the official Blueprint package
+ <link rel="stylesheet" id="plugin-fancy-type" href="../blueprint/plugins/fancy-type/screen.css" type="text/css" media="screen" />
+ <link rel="stylesheet" id="plugin-rtl" href="../blueprint/plugins/rtl/screen.css" type="text/css" media="screen" />
+ <link rel="stylesheet" id="plugin-buttons" href="../blueprint/plugins/buttons/screen.css" type="text/css" media="screen" />
+ <link rel="stylesheet" id="plugin-link-icons" href="../blueprint/plugins/link-icons/screen.css" type="text/css" media="screen" />
+ -->
+
+ <!-- Non-Core Plugins
+ activate only when downloaded from the following links
+ link: https://github.com/joshuaclayton/blueprint-css/wiki/Plugins
+ <link rel="stylesheet" id="nc-plugin-liquid" href="../blueprint/plugins/liquid/liquid.css" type="text/css" media="screen" />
+ <link rel="stylesheet" id="nc-plugin-tabs" href="../blueprint/plugins/tabs/screen.css" type="text/css" media="screen" />
+ <link rel="stylesheet" id="nc-plugin-silksprite" href="../blueprint/plugins/silksprite/sprite.css" type="text/css" media="screen" />
+ -->
+
+ <!--
+ ___ ADD YOUR TEST HERE ___
+ link from here to your custom stylesheet
+ link: https://example.com/
+ <link rel="stylesheet" id="test-___" href="___.css" type="text/css" media="screen" />
+ -->
+
+ <!-- DEBUGGER
+ Added last to load with higher specifity
+ This stylesheet will highlight non-standard markup and unnecessary classes
+ <link rel="stylesheet" id="plugin-debugger" href="debug.css" type="text/css" media="screen" />
+ -->
+
+</head>
+
+<body>
+
+ <!-- #header -->
+ <div class="container">
+ <div id="title" class="span-24 append-bottom">
+ <h1 class="prepend-top">DEBUG ENVIRONMENT</h1>
+ <h2 class="alt">Use this page for developing or testing Blueprint &amp; posting problems on the Blueprint mailing list.</h2>
+ </div>
+
+ <!-- #add description here -->
+ <div id="description" class="span-24 append-bottom">
+ <hr />
+ <h3 class="alt">Testcase below: ___YOUR CASE___</h3>
+ <hr />
+ <div class="span-11 colborder">
+ <p>Enter the result you want to achieve here.</p>
+ </div>
+ <div class="span-12 last">
+ <p class="push-1">Enter your problem &amp; what you already tried here.</p>
+ </div>
+ </div>
+ <!-- /description -->
+ </div>
+ <!-- /header -->
+
+
+ <!-- #DEVELOPMENT -->
+ <div class="container showgrid">
+
+ <!-- START #testcase -->
+ <div id="testcase" class="span-24">
+ <p>
+ You should rename this file to a specific testcase, like debug-test1.html
+ <br />
+ You can then add your mark-up to this container.
+ <br />
+ Then post this testcase to
+ <a href="http://github.com">Github Gist</a> or make a
+ <a href="http://pastebin.com/">Pastebin</a> and share it on
+ <a href="http://groups.google.com/group/blueprintcss">the list</a>.
+ <br />
+ Remember to change the doctype if you are not using HTML 4.01 Strict!
+ <p>
+ </div>
+ <!-- END #testcase -->
+
+ </div>
+ <!-- /DEVELOPMENT -->
+
+
+ <!-- #footer -->
+ <div id="footer" class="container prepend-top">
+ <hr />
+ <p class="alt right">
+ Brought to you by the Blueprint core team &copy; 2011.
+ <a href="https://gist.github.com/795687">(Download here)</a>
+ </p>
+ </div>
+ <!-- /footer -->
+
+</body>
+
+</html>
+<!-- That's all folks. Happy testing! -->
@@ -115,7 +115,7 @@ hr {
float: none;
width: 100%;
height: 1px;
- margin: 0 0 1.45em;
+ margin: 0 0 17px;
border: none;
}

0 comments on commit 9d29d1e

Please sign in to comment.