Rommeo Posted October 4, 2009 Share Posted October 4, 2009 I have a "wrapper", In wrapper I have a "news" div. My problem is, I made the "news"-div-bottom dotted. But when I run it, It does not see the photo, It ends where the text ends(photo and text are together). I want to make the bottom dotted ( where the photo ends ) Please check attachment photo, you will see it clearly ; http://img150.imagevenue.com/img.php?image=35492_problem_122_723lo.jpg my html is : <body> <div id="wrapper"> <div id="news"><img src="federer.jpg" width="124" height="121" class="photo">Federer is ready !(here is inside the news div) </div> </div> </body> and my css file is : #wrapper { margin: 0px; padding: 0px; width: 200px; } #news { margin: 0px; padding: 0px; width: 200px; border-bottom-width: 1px; border-bottom-style: dotted; } .photo { margin: 0px; padding: 0px; float: left; } Was trying to solve this problem for hours, tried everything -div inside the div, float left, clear both did not work.. What should I do to make it longer enough ? Link to comment https://forums.phpfreaks.com/topic/176436-how-to-deal-with-this-photo/ Share on other sites More sharing options...
Kieran Menor Posted October 4, 2009 Share Posted October 4, 2009 Did you try this: <body> <div id="wrapper"> <div id="news"><img src="federer.jpg" width="124" height="121" class="photo">Federer is ready !(here is inside the news div) <div style="clear: both;"></div> </div> </div> </body> Link to comment https://forums.phpfreaks.com/topic/176436-how-to-deal-with-this-photo/#findComment-930161 Share on other sites More sharing options...
CarbonCopy Posted October 4, 2009 Share Posted October 4, 2009 Using a clear div does solve the problem. I suggest you read about floats and clears. This is required a lot when you use floated columns and such. Link to comment https://forums.phpfreaks.com/topic/176436-how-to-deal-with-this-photo/#findComment-930250 Share on other sites More sharing options...
haku Posted October 5, 2009 Share Posted October 5, 2009 You don't need the clear div. Just add: overflow:auto; to your div#wrapper. Adding a clearing div just adds extra unnecessary markup. Link to comment https://forums.phpfreaks.com/topic/176436-how-to-deal-with-this-photo/#findComment-930395 Share on other sites More sharing options...
CarbonCopy Posted October 5, 2009 Share Posted October 5, 2009 Thanks for the advice, wish I would of known that a long time ago Link to comment https://forums.phpfreaks.com/topic/176436-how-to-deal-with-this-photo/#findComment-930988 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.