This is a forum where members new and old can come to ask questions and get info and opinions. It is not a place to advertise your business or have other forms of advertising, whether it be in your posts or signature.

All links in the forum will not be indexed by Search Engines and any unapproved forms of advertising or spam will be dealt with accordingly, deleted, and that member's account banned.

Forums

Overview » CSS » "Float:left" style is not behaving as expected. Can i get help ?

"Float:left" style is not behaving as expected. Can i get help ?
ps sheba Member Since: 27 Oct 2007 Posts: 6	Posted 06 Oct 2009 11:04:33 Hi everyone, The following code: <head> <title>test</title> <meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" /> <meta http-equiv="Content-Language" content="en-us" /> <style type="text/css"> #first {width:1em; float:left; border:1px solid red;} #second {width:10em; border:1px solid blue;} </style> </head> <body> <h1 id="first"> A</h1> <h1 id="second">B</h1> </body> Yields a page where "B" is placed next to "A" at its' right side, a bit highr though. When i change "width" style of #second selector into 1em, "B" drops down beneath "A" as opposed to "float:left" of #first selector. Can anyone explain me why, when "width" of #second selector is 1em , B is not placed at the right side of "A" ? Thanks Hi everyone, The following code: <head> <title>test</title> <meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" /> <meta http-equiv="Content-Language" content="en-us" /> <style type="text/css"> #first {width:1em; float:left; border:1px solid red;} #second {width:10em; border:1px solid blue;} </style> </head> <body> <h1 id="first"> A</h1> <h1 id="second">B</h1> </body> Yields a page where "B" is placed next to "A" at its' right side, a bit highr though. When i change "width" style of #second selector into 1em, "B" drops down beneath "A" as opposed to "float:left" of #first selector. Can anyone explain me why, when "width" of #second selector is 1em , B is not placed at the right side of "A" ? Thanks

"Float:left" style is not behaving as expected. Can i get help ?

ps sheba
Member

Since: 27 Oct 2007
Posts: 6

Posted 06 Oct 2009 11:04:33

Hi everyone,
The following code:

<head>
<title>test</title>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-us" />
<style type="text/css">
  #first {width:1em; float:left; border:1px solid red;}
  #second {width:10em; border:1px solid blue;}
</style>
</head>
<body> 
<h1 id="first"> A</h1>
<h1 id="second">B</h1>
</body>

Yields a page where "B" is placed next to "A" at its' right side, a bit highr though. When i change "width" style of #second selector into 1em, "B" drops down beneath "A" as opposed to "float:left" of #first selector.
Can anyone explain me why, when "width" of #second selector is 1em , B is not placed at the right side of "A" ?
Thanks

Hi everyone,
The following code:

<head>
<title>test</title>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-us" />
<style type="text/css">
  #first {width:1em; float:left; border:1px solid red;}
  #second {width:10em; border:1px solid blue;}
</style>
</head>
<body> 
<h1 id="first"> A</h1>
<h1 id="second">B</h1>
</body>

Patrick Julicher
Official Representative

Since: 04 Feb 2002
Posts: 1,208

Replied 18 Oct 2009 21:47:47

Hi,

Try the following code. This works!

<head>  
<title>test</title>  
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />  
<style type="text/css">  
 #first {width:1em; float:left; border:1px solid red;}  
 #second {width:5em; border:1px solid blue;}  
</style>  
</head>  
<body>   
<div id="first">
  [h1]A[/h1]
</div>  
<div id="second">
  [h1]B[/h1]
</div>  
</body>

Kind regards, Patrick

Reply to this topic

Message
Reply

Live Support

Visit All Zones

Latest Extensions

Premium Articles

DMXzone Updater

Our Sponsors

Find Us on Facebook

Featured Extension

Extensions Yearly Subscription

Tired of purchasing many extensions just to finish up your project. Now we have a solution for you. For a small fee you have access to over 70 high-quality (all DMXzone extensions) and growing Dreamweaver extensions for a year period!

Additionally, we're working on many new ones, which will be available for every subscription holder when released!