Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations bkrike on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Forcing a DIV onto the next line 1

Status
Not open for further replies.

gmail2

Programmer
Jun 15, 2005
987
IE
I have a div which is 800px long and contains 7 div's. 6 of the div's (3 top and 3 bottom) form the top and bottom to give me rounded corners and work perfectly. However, at some point I want to "slide" antoher div in beside (using javascript) and therefore need them to resize accordingly. This all works fine so long as none of the div's on the next "line" can fit into the space on the right hand side. But obviously, as soon as the div's are small enough - the fit into the first available space - which I don't want them to do. Anybody got any ideas how I can get around this? I tried clear: both but that didn't do anything. To make it clearer go to = and click the link at the bottom. As soon as you click the link the main_bl div moves to the very top underneath the nav bar.

Also, any ideas why the W3C said that there is not language attribe (for the script tag) when I validated?? If I don't put in the language attribue, how do browsers know if I'm using JavaScript, or another scripting language like jscript etc?

Irish Poetry - Karen O'Connor
Get your Irish Poetry Published
Garten und Landschaftsbau
 
Also, any ideas why the W3C said that there is not language attribe (for the script tag) when I validated?? If I don't put in the language attribue, how do browsers know if I'm using JavaScript, or another scripting language like jscript etc?
You use
Code:
<script type="text/javascript">
<!--//

//-->
</script>

M. Brooks
 
If I take away [tt]float: left;[/tt] from #main_body I get expected look and suffer no penalties for it.

I also know why validator complains about the language attribute. Because script element has no language attribute. It does however have type attribute where you define the type. For your case, it would be [tt]type="text/javascript"[/tt].
 
hmm ... you're using Firefox Vragabond aren't you !?!? Just after I posted I tried it out in firefox and sure enough it worked fine too, with the clear: both attribute set. But the problem is, it's supposed to be centered in the middle of the window - in firefox it's on the left. However, now that I look at my code again I can't figure out why IE IS putting it in the center ... I think firefox is right !! So I think I need to fix that first and then see what happens.

So with the whole script tag thing - I presume browsers know that it's javascript from the type attribute then?

Irish Poetry - Karen O'Connor
Get your Irish Poetry Published
Garten und Landschaftsbau
 
The content is centered in IE because IE accepts the incorrect method of centering via [tt]text-align: center;[/tt] method on your body tag. Text-align center should only work on text and not on block level elements. To center those, one needs to add [tt]margin: 0 auto;[/tt] to their declaration. This means that the element should have a top and bottom margin of 0 and left and right margin of auto -- meaning left and right should equally distribute any remaining space in the width, thus shoving the element in the center. So if you apply that margin: 0 auto; styles to your two main divs that hold the entire page -- the #main_content and the one that holds the navigation and header, your page should be at the center. Adding [tt]clear: both;[/tt] to the paragraph that holds the 'make me smaller' will help it move to the bottom of the page.

But that question answered, did my suggestion work with your first problem?

And yes, script tags language is identified by the type attribute.
 
Yea, I had a feeling it was something like that. Your suggestion works on firefox but not on IE - if I take away float: left then in IE the main_body div does get resized but stays in the center. I'm gonna have another play after a while and take away the text-align and try out the padding instead.

Thanks for your post

Irish Poetry - Karen O'Connor
Get your Irish Poetry Published
Garten und Landschaftsbau
 
Interesting enough, I get the same result both in my Mozilla and IE6 while testing your page.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top