House of Fusion
Search over 2,500 ColdFusion resources here
  
Home of the ColdFusion Community

Mailing Lists
Home /  Groups /  Cascading Style Sheets (CSS)

Show a form to the right of a float

  << Previous Post |  RSS |  Tree View |  Sort Oldest First |  Subscribe to this Group Next >> 

Show a form to the right of a float.

>> Adding a margin-left to the form gets me close, but it assumes I have a Peter Boughton 12/18/2007 06:59 PM
I have content that I am floating to the left.  This content does not Ian Skinner 12/18/2007 05:12 PM

12/18/2007 06:59 PM
Author: Peter Boughton Short Link: http://www.houseoffusion.com/groups/css/thread.cfm/threadid:1543#4850 >> Adding a margin-left to the form gets me close, but it assumes I have a >> know width for the content. Mirror that. You have a known width for the right-hand column, so put a margin-right on the left-hand one. On Dec 18, 2007 10:10 PM, Ian Skinner <HOF@ilsweb.com> wrote: ----- Excess quoted text cut - see Original Post for more -----
12/18/2007 05:12 PM
Author: Ian Skinner Short Link: http://www.houseoffusion.com/groups/css/thread.cfm/threadid:1543#4849 I have content that I am floating to the left.  This content does not have a fixed width and I am letting it shrink wrap.  I want the form in the following div to display to the right of the floated content.  As you can see the border and background of the form flows through the floated content.  This is not desirable.  Is there an easy way to do this? Adding a margin-left to the form gets me close, but it assumes I have a know width for the content. TIA Ian CODE ---------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">; <html xmlns="http://www.w3.org/1999/xhtml">;     <head>         <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />         <title>Untitled Document</title>         <style type="text/css">             div#left {                 border: 2px dashed blue;                 float: left;             }                          div#right {                 border: 2px dashed red;             }                          form {                 border: 5px outset green;                 background-color: #ccc;                 width: 30em;             }         </style>     </head>          <body>     <div id="left">         <h1>Div floated to the left</h1>         <p>             Here is content that will be of a variable width.<br />             In reality it will contain a table with data<br />             that can sometimes be wider then other times.<br />             And sometimes may not be present at all.         <p>     </div>          <div id="right">         <form action="foo.bar" method="post">             <h1>A form to display to the left.</h1>             <label for="foo">A field.<input id="foo" type="text" /></label>         </form>     </div>     </body> </html>
<< Previous Thread Today's Threads Next Thread >>

Search css

August 30, 2014

<<   <   Today   >   >>
Su Mo Tu We Th Fr Sa
           1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31             

Designer, Developer and mobile workflow conference