+ 2

I cant get the text to stay in the div

the text wont stay in the div: html: <!DOCTYPE HTML> <html> <head> <link rel="stylesheet" type="text/css" href="Learn.css"/> </head> <body> <div id="NavBar"> <a href="https://www.youtube.com/channel/UC-kNQZyspQY1OUKMalbx_uQ"> <img src="https://s-media-cache-ak0.pinimg.com/originals/dc/4d/23/dc4d238b3da6d02bcc5080b58fd5c009.jpg" id="Logo"/></a> <p id="Title">ANGEL ARMY WEBPAGE</p> </div> <script src="Learn.js"></script> </body> </html> css: #NavBar { background-color: #c4c5c6; width: 1837px; height: 100px; } #Logo { width: 100px; height: 100px; } #Title { font-size: 50px; font-family: "Times New Romans", "serif"; text-align: center; margin: 0px; width: 1437px; height: 58px; } PLEASE HEELLLP

html css web

3rd Jul 2017, 10:32 PM

Joshua

8 Answers

+ 5

Problem was, p was pushing it down a line. Replaced with I tags and displays fine... tho I think there's a better answer, that's what I came up with for you off the top of my head. https://code.sololearn.com/WzH8zG9fNXs7/?ref=app BTW 1875px is super duper wide on mobile

3rd Jul 2017, 10:42 PM

Russel Reeder

+ 15

Easiest way is to float your image, in your case it's enough! img { float: left; }

3rd Jul 2017, 10:40 PM

Maz

+ 10

Nice one @Russel, cleaner than my solution, just one more thing... <i> as maybe you already know is an inline element, so... you can remove most of that lines and get the same output: #Title { font-size: 50px; font-style: normal; font-family: "Times New Romans", serif; }

3rd Jul 2017, 10:52 PM

Maz

+ 3

@Joshua, @maz & @russel, instead of <i> or the <p> tags, the span tag might be better, then you wouldn't have to worry about coding the font-style to normal or extra coding at all in css edit --- another solution: https://code.sololearn.com/WyYsMqV9Ouv0/?ref=app

4th Jul 2017, 12:11 AM

Dustin Hammack