Jump to content

floating problem again


Abby

Recommended Posts

I have a simple container with text-align:left, and other text floated on the right (with a large right margin). The right-floated text should be on the same line as the left text. It should *never* wrap to the next line. Assiging a "float:right" to this special text works fine in FF and IE8. However, it wraps to the next line when the browser window gets minimized a lot. And worse ... it wraps immediately in lower versions of IE. How do I work around this problem? I've included the relevant code, below.HTML:

.blurb {  min-width:200px;  max-width:85%;  color:#000;  text-align:left;  line-height:94%;  font-weight:bold;  background-color:#bec;  -webkit-border-radius:5px;  -moz-border-radius:5px;  border-radius:5px;  padding:5px;  margin:0 16px 6px 150px;}.blurb span {float:right; margin-right:12%;}

Oh, and one more question. It looks like border-radius is not valid CSS, although it works fine in the browser tests. Is border-radius a CSS2 vs CSS3 property issue?Thanks.

Link to comment
Share on other sites

border-radius is a CSS3 property, but it doesn't work in IE (yet, come on IE9!) Can you provide a link to your site so we can see exactly what's happening? I have a hunch that it's because you're using a <span> to float right, but I want to see it action first. You could try setting display: inline-block on the element to see if that fixes it, though. Also, a min-width wouldn't be a bad thing here.

Link to comment
Share on other sites

Here's the page. (Warning: Nude drawings, may not be safe for work).I added display:inline-block, and I altered the min-width to 560px. That solves the problem for FF and IE8, but it still displays wrong in IE7. What's wrong with using a <span>? I don't know much about how CSS and HTML really work.Thanks for your help!
Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...