| | |
getting text to float
Please support our HTML and CSS advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
![]() |
Hia groovers,
I've just got a site up with a couple of glitches I've been puzzling over. Foremost a difficulty with trying to keep the pages as clean and fluid as possible (it's kiddy friendly). To this end I wanted to have the central text as an 'auto' scroll which will only get scroll bars when the bottom navigation console gets in the way. But all my attempts to play with floats haven't worked. It seems the web is designed for text to be able to flow on down.
Another glitch is a floating element in Firefox coming down the screen.
I'd so love your input. And any other comments most welcome... :cheesy:
http://www.aberdeen-education.org.uk...DriveHomeC.htm
shows off both problems
cheers
anax
I've just got a site up with a couple of glitches I've been puzzling over. Foremost a difficulty with trying to keep the pages as clean and fluid as possible (it's kiddy friendly). To this end I wanted to have the central text as an 'auto' scroll which will only get scroll bars when the bottom navigation console gets in the way. But all my attempts to play with floats haven't worked. It seems the web is designed for text to be able to flow on down.
Another glitch is a floating element in Firefox coming down the screen.
I'd so love your input. And any other comments most welcome... :cheesy:
http://www.aberdeen-education.org.uk...DriveHomeC.htm
shows off both problems
cheers
anax
•
•
•
•
Originally Posted by Anax
I'd so love your input. And any other comments most welcome... :cheesy:
Also, I'm confused what you're asking because I'm using IE, and the body text only gets a vertical scrollbar when I squish the window small enough that the bottom navigation starts to overlap it. Isn't that what you want it to do?
What I do here at DaniWeb is I encace all posts in [html]<div style="overflow-x:auto; width:650px">[/html] This way if someone posts a huge picture or a long line of code, it doesn't stretch out the whole page too wide and screw up the layout. Instead, it just puts a horizontal scrollbar beneath the problem post. I'm not sure if that's what you're asking. Basically, the overflow: attribute should currently work with all the latest browsers. However, I believe that overflow-x and overflow-y are currently IE-only but Firefox will support them in an upcoming version... I THINK. Please don't quote me on it.
Oh! On second thought, I just realized what you wanted. Suppose you use the float attribute, but it overlaps an element beneath it. What you want to do is encase the element beneath it with [html]<div style="clear:left|right|both">[/html]
Here's an example. Suppose you have [html]<div style="float:left">Blah Blah</div>
<div>More Text</div>[/html] But you don't want More Text to show up until after the Blah paragraph has finished. What you want to do is encase More Text in [html]<div style="clear:left">[/html] This pushes the <div> down so that it doesn't start until all floats coming from its left have finished. You would use clear:both to protect yourself from floats coming from both sides. Experiment. Try it. See if it does what you want it to. If I am reading you correctly, you want to wrap your bottom navigation into a clear:both, but I'm still a little confused what you're asking.
Here's an example. Suppose you have [html]<div style="float:left">Blah Blah</div>
<div>More Text</div>[/html] But you don't want More Text to show up until after the Blah paragraph has finished. What you want to do is encase More Text in [html]<div style="clear:left">[/html] This pushes the <div> down so that it doesn't start until all floats coming from its left have finished. You would use clear:both to protect yourself from floats coming from both sides. Experiment. Try it. See if it does what you want it to. If I am reading you correctly, you want to wrap your bottom navigation into a clear:both, but I'm still a little confused what you're asking.
•
•
•
•
Also, I'm confused what you're asking because I'm using IE, and the body text only gets a vertical scrollbar when I squish the window small enough that the bottom navigation starts to overlap it. Isn't that what you want it to do?
You got me right first go. The problem is many people with their small browser windows are finding the text is lost under console before scroll bars appear. I played around with % height and settled on 45%.
I learnt from your second reply and have experimented with your suggestions re clears, and can see why I was confusing with my talk of floats. I was thinking I could float my graphics that need to remain stuck to bottom of window and get my central text to stop and get a scroll bar when it was hit.
To put it another way I want my central text block to stop at the bottom minus 180px.
cheers again
anax
I'm really stuck
![]() |
Similar Threads
- Highlight the text menu if on current page (JavaScript / DHTML / AJAX)
- Basic doubt (C++)
- Text Not Showing up in IE, Fine in Firefox * NS (JavaScript / DHTML / AJAX)
- write to text file using fprintf() (C)
- Help with comparing user input to a text file! (C++)
Other Threads in the HTML and CSS Forum
- Previous Thread: Teach me HTML please
- Next Thread: want one more help
| Thread Tools | Search this Thread |
appointments asp background backgroundcolor beta browser bug calendar cart cgi code codeinjection corporateidentity css design development displayimageinsteadofflash dreamweaver emailmarketing epilepsy explorer firefox flash form format google griefers hackers hitcounter hover html ide ie7 ie8 iframe image images internet internetexplorer intranet iphone javascript jpeg layout macbook maps marketshare microsoft mozilla multimedia navigationbars news offshoreoutsourcingcompany opacity opera optimization pnginie6 positioning problem scroll seo shopping studio swf swf. textcolor timecolor titletags url urlseparatedwords visual visualization web webdevelopment webform website windows7







