daddyalfie Posted October 3, 2011 Report Share Posted October 3, 2011 On THIS web-page I floated-left the thumbnail links at the top in a <ul> so as to display them in line. But then the "I" in the first paragraph below (I remember...) floated right up with the thumbnails! I solved it by adding margin-right to the <li> until it was pushed down to where it belongs. I first tried to add clear: left; to the paragraph CSS, but that screwed everything up beyond recognition! I know there must be a smarter way to fix this! As always - thanks! Alfie Quote Link to comment Share on other sites More sharing options...
akurtula Posted October 3, 2011 Report Share Posted October 3, 2011 I think you can use clear:both; for the paragraph. Or add ul#gallery{overflow:auto;) If I am right and the overflow:auto works then I would use that Quote Link to comment Share on other sites More sharing options...
Andrea Posted October 3, 2011 Report Share Posted October 3, 2011 Did you try 'clear: both'? (or is it 'clear: all'? --- I never remember that and don't have time to look) Quote Link to comment Share on other sites More sharing options...
daddyalfie Posted October 3, 2011 Author Report Share Posted October 3, 2011 (edited) @ Andrea: I never thought I would have to correct YOU!! It is clear: both; and it did not work either anyway. @ akurtula: Thanks and I shall investigate the "overflow" property. That sounds interesting! What I do not understand properly is the "display: inline;" CSS property. Would that put the thumbnails "All-In-A-Row"? (or is that in-line ?) Thanks for looking! Alfie Edited October 3, 2011 by daddyalfie Quote Link to comment Share on other sites More sharing options...
akurtula Posted October 4, 2011 Report Share Posted October 4, 2011 (edited) the inline does the same thing you did with the thumbnails - it will display them horizontally. So saying ul li{float:left;} is the same as ul li{display:inline;} But I never used the inline (I am used to the floating way) so I am not 100% sure whether it's a good idea or not use this to quickly test any css you are not sure off http://www.w3schools.com/cssref/tryit.asp?filename=trycss_display_inline Edited October 4, 2011 by akurtula Quote Link to comment Share on other sites More sharing options...
Andrea Posted October 4, 2011 Report Share Posted October 4, 2011 @ Andrea: I never thought I would have to correct YOU!! It is clear: both; and it did not work either anyway. I don't think that falls under the definition of correction The reason things fell apart on you with the clear; both is that the div the text is in is as wide as your wrapper and clearing the p throws it under your floated nav division. I don't think your layout is wrong - it works, but I'd have added the background images to a wrapper/header/footer and would have my content div separate next to the nav. You're still mixing lower and upper case - next time something isn't working, see if that's not the problem Quote Link to comment Share on other sites More sharing options...
daddyalfie Posted October 4, 2011 Author Report Share Posted October 4, 2011 I don't think that falls under the definition of correction Your answer is brilliant and I shall work that angle. Thank you! I shall also check out the inline solution, so thanks for that as well! Alfie Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.