Nuv Posted September 10, 2012 Share Posted September 10, 2012 I want that my text container's width should be static (100px). However, when i put width:100px; in my #content the main container (with orange color) changes its width and not the text. The text should come to the next line after exceeding 100 px My HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>CMS - BLOG </title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link rel="stylesheet" href="main.css" type="text/css"> </head> <body> <div class = "container"> <div class="content-container"> <span id="content"> Something Something Something Something Something Something Something Something Something Something Something<br> </span> </div> </div> </body> </html> Main.css .container { float:left; margin:20px; background:rgba(227,162,11,0.7); } .content-container { margin:20px; } #content { width:100px; font-size: 18px; color: #333333; } Quote Link to comment Share on other sites More sharing options...
Jessica Posted September 10, 2012 Share Posted September 10, 2012 Spans are inline instead of block, you'd need to either add display:block to your #content, or use a div or p. Quote Link to comment Share on other sites More sharing options...
Nuv Posted September 10, 2012 Author Share Posted September 10, 2012 Did so. Doesnt help Thankyou for replying though Quote Link to comment Share on other sites More sharing options...
Nuv Posted September 10, 2012 Author Share Posted September 10, 2012 Btw im using reset.css too as mentioned here. Quote Link to comment Share on other sites More sharing options...
Jessica Posted September 10, 2012 Share Posted September 10, 2012 It does fix it, I downloaded your files and made that change. You may need to add !important; to it, but that is the fix. Quote Link to comment Share on other sites More sharing options...
Nuv Posted September 10, 2012 Author Share Posted September 10, 2012 It does fix it, I downloaded your files and made that change. You may need to add !important; to it, but that is the fix. Yes you are correct. I am really sorry, i did try that. It didnt work at that time. Now it is. Thanks a lot. 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.