homepage Welcome to WebmasterWorld Guest from 54.196.24.103
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: DrDoc

CSS Forum

    
Floating not working as expected
I can't believe I've never encountered this before
MatthewHSE




msg:3585029
 2:51 pm on Feb 26, 2008 (gmt 0)

I'm experienced enough with CSS that I should know the answer to this. Maybe I'm just having a mind-block, but in any case, it's got me baffled. Here's the code:

<html>
<head>
<title>Float issue</title>
<style type="text/css">
#breadcrumbs {
font: 8pt/8pt normal verdana, arial, sans-serif;
padding: 3px;
margin: 0 10px 10px;
border: 1px solid #a9a9a9;
background: #dcdde9;
}
#sitemap {
float: right;
font-size: 7pt;
}
</style>
</head>
<body>
<div id="breadcrumbs">
<strong>You Are Here:</strong> Path > To > Current > Page
<a id="sitemap" href="sitemap.html">Site Map</a>
</div>
</body>
</html>

If you try the code, you'll see that the "Site Map" link is not being enclosed in the #breadcrumbs div. In Firefox, it's kind of half-in and half-out. In IE, it's all the way outside the border below the div.

I wanted it to be enclosed in the div, just like the rest of the text, but at the right-hand edge of it. This should be simple, and I should at least be able to figure out what's actually going on...maybe I'm just out of practice.

Thanks in advance,

Matthew

 

4css




msg:3585049
 3:12 pm on Feb 26, 2008 (gmt 0)

Do you have any clearing applied for the floats anywhere?

Also, I know there are some who believe that a size won't matter, however, I always put a size on my containers that float.

wtkad




msg:3585059
 3:16 pm on Feb 26, 2008 (gmt 0)

Shouldn't the link be before the other text so it will float to the right of it? It works correctly for me with that change.

<div id="breadcrumbs">
<a id="sitemap" href="sitemap.html">Site Map</a>
<strong>You Are Here:</strong> Path > To > Current > Page
</div>

MatthewHSE




msg:3585081
 3:35 pm on Feb 26, 2008 (gmt 0)

Shouldn't the link be before the other text so it will float to the right of it?

Duh! <slaps forehead> I knew I had a mindblock somewhere! Yes, you're right. Thanks for pointing that out! :)

4css




msg:3586011
 12:30 pm on Feb 27, 2008 (gmt 0)

I missed that one as well. I was looking at the css. Reminder to always view html code as well. :) Sorry about that MatthewHSE

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved