Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Senior Coder BarrMan's Avatar
    Join Date
    Feb 2005
    Location
    Israel.
    Posts
    1,644
    Thanks
    69
    Thanked 83 Times in 82 Posts

    Float in divs doesn't work properly

    Hey.
    I'm trying to float my divs so it will have 3 different divs in a row.
    It looks like this now:

    And I want it to look like this:


    And I want Create a row, How to and Create a database to be in the same row.
    This is my code:
    Code:
    <fieldset id="container">
    		<legend>
    			[Create Database]
    		</legend>
    		<ul id="ul_inputs">
    			<li>
    				<input type="text" class="Database_Inputs" name="row1" value="Enter_new_value" />
    			</li>
    		</ul>
    		<div style="float:left">
    			<div style="float:left; width: 130px;">
    				<input type="button" class="buttons" onClick="createRow();" value="Create a new row" />
    			</div>
    			<div style="float: right; width: 60px">
    				<a style="cursor: help;" href="#" onclick="BubbleHelp('howto');">How to</a>
    			</div>
    		</div>
    		<div style="float: right; width: 130px;">
    			<input id="createDatabase" type="submit" onClick="Enter=true;" class="buttons" value="Create database" />
    		</div>
    	</fieldset>
    This is my CSS file:
    Code:
    CSS{
    	margin: 0px;
    	padding: 0px;
    }
    * {
    	margin: 0px;
    	padding: 0px;
    }
    body,div,span,fieldset,legend,input{
    	font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
    	margin: 0px;
    	padding: 0px;
    }
    legend{
    	font-weight: bold;
    	border: 1px solid blue;
    	border-bottom: 0px;
    	margin: 2px;
    }
    #Type{
    	position: absolute;
    	display: none;
    	background-color: lightgrey;
    	top:0px;
    	left:0px;
    	width: 0px;
    	height: 0px;
    	font-size: 8pt;
    }
    fieldset#container input.buttons{
    	border: 1px solid black;
    }
    fieldset#container{
    	margin: auto;
    	width: 400px;
    	border: 1px solid blue;
    }
    fieldset#container ul{
    	list-style: none;
    	margin: 1em;
    }
    fieldset#container ul li{
    	margin-bottom: 5px;
    }
    fieldset#container #createDatabase{
    	float:right;
    	text-decoration: underline;
    }
    fieldset#container legend input#headTitle{
    	font-weight: bold;
    	border: 0;
    }
    fieldset#container input#int{
    	background-color: lightgrey;
    	border: 1px solid black;
    }
    .BubbleHelp{
    	border: 1px dashed red;
    	width: 400px;
    	height: 50px;
    	overflow: auto;
    	display: none;
    	margin: 20px auto;
    	padding-left: 5px;
    }
    The blue colored code is the relevant code.

    Thanks!

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,851
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Have a try like

    Code:
                   <ul id="ul_inputs">
    			<li>
    				<input type="text" class="Database_Inputs" name="row1" value="Enter_new_value" />
    			</li>
    		</ul>
    		<div >
    				<div style="float:left; width: 130px;">
    					<input type="button" class="buttons" onClick="createRow();" value="Create a new row" />
    				</div>
    				<div style="float: left; width: 60px">
    					<a style="cursor: help;" href="#" onclick="BubbleHelp('howto');">How to</a>
    				</div>
    				<div style="float: left; width: 130px;">
    				<input id="createDatabase" type="submit" onClick="Enter=true;" class="buttons" value="Create database" />
    				</div>
    		</div>
    Last edited by abduraooft; 09-26-2007 at 09:53 AM.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • Users who have thanked abduraooft for this post:

    BarrMan (09-26-2007)

  • #3
    Senior Coder BarrMan's Avatar
    Join Date
    Feb 2005
    Location
    Israel.
    Posts
    1,644
    Thanks
    69
    Thanked 83 Times in 82 Posts
    Thanks that works!!!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •