eduard Posted February 27, 2011 Share Posted February 27, 2011 How do I change the font-family of the div ´footer´?a:link,a:visited{border-bottom-style:solid;border-color:#808080;color:#6A5ACD;text-decoration:none;display:block;background-color:#A9A9A9;width:8%;height:24%;text-align:center;padding:2px;}a:hover,a:active{background-color:#000000;}body{overflow:scroll;margin:0px;padding:0px;width:100%;}div.header{border-style:solid;border-width:5px;border-color:#808080;content:100%;width:100%;background-color:#6495ED;height:15em;padding:0px;}div#main{width:100%;height:16em;background-color:#ADD8E6;padding:0px;margin:0px;border:0px;border-style:solid;}div.footer{background-color:#6495ED;border-style:solid;border-color:#808080;border-width:5px;width:100%;height:15em;text-align:center;}p{(font-family:"Times New Roman","Georgia":)font-size:40px;color:#000000;}h5{text-align:center;color:#000080;(font-family:"Times New Roman","Georgia!} Link to comment Share on other sites More sharing options...
thescientist Posted February 27, 2011 Share Posted February 27, 2011 http://www.w3schools.com/css/pr_font_font-style.asp Link to comment Share on other sites More sharing options...
eduard Posted February 27, 2011 Author Share Posted February 27, 2011 http://www.w3schools.com/css/pr_font_font-style.aspThanks!(I did!) Link to comment Share on other sites More sharing options...
cousineaug Posted February 27, 2011 Share Posted February 27, 2011 How do I change the font-style of the div ´footer´?perhaps the problem is typos in your style sheetp{(font-family:"Times New Roman","Georgia";) why round brackets here?font-size:40px;color:#000000;}h5{text-align:center;color:#000080;(font-family:"Times New Roman","Georgia!;) round brackets again and close quote missing} Link to comment Share on other sites More sharing options...
eduard Posted February 28, 2011 Author Share Posted February 28, 2011 I don´t manage to change the font-family!<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><HTML><head><meta http-equiv="content-type" content="text/ html; charset=UTF-8"><title>Eduard Lid</title><link rel="stylesheet" type="text/css" href="ex1.css"></head><body><div class="header"><a href="http://www.viadeo.com/es/profile/eduard.lid"><b><h4>Profile</h4></b></a><a href="web_designer/image_and_text_database.html"><b><h4>Web designer (databases)</h4></b></a></div><div id="main"><img src="images/me.JPG" alt="Eduard Lid" align="right" width="350" height="256"/></div><div class="footer"<h6>This website is made by ©</h6><h1>Eduard Lid</h1><h5>(1152*720px)</h5></div></body></HTML>a:link,a:visited{border-bottom-style:solid;border-color:#808080;color:#6A5ACD;text-decoration:none;display:block;background-color:#A9A9A9;width:8%;height:24%;text-align:center;padding:2px;}a:hover,a:active{background-color:#000000;}body{overflow:scroll;margin:0px;padding:0px;width:100%;}div.header{border-style:solid;border-width:5px;border-color:#808080;content:100%;width:100%;background-color:#6495ED;height:15em;padding:0px;}div#main{width:100%;height:16em;background-color:#ADD8E6;padding:0px;margin:0px;border:0px;}div.footer{background-color:#6495ED;border-style:solid;border-color:#808080;border-width:5px;width:100%;height:15em;text-align:center;p.sansserif{font-family:Arial,Helvetica,sans-serif;}font-size:40px;color:#000000;}h5{text-align:center;color:#000080;p.sansserif{font-family:Arial, Verdana;}} Link to comment Share on other sites More sharing options...
cousineaug Posted February 28, 2011 Share Posted February 28, 2011 I don´t manage to change the font-family!div.footer{background-color:#6495ED;border-style:solid;border-color:#808080;border-width:5px;width:100%;height:15em;text-align:center;p.sansserif{font-family:Arial,Helvetica,sans-serif;}font-size:40px;color:#000000;}h5{text-align:center;color:#000080;p.sansserif{font-family:Arial, Verdana;}}Your problem is that you cannot write a style inside another one.Your style sheet should look likediv.footer{background-color:#6495ED;border-style:solid;border-color:#808080;border-width:5px;width:100%;height:15em;text-align:center;font-size:40px;color:#000000;}.sansserif{font-family:Arial,Helvetica,sans-serif;}h5{text-align:center;color:#000080;} and then your HTML <h5>This is a normal title</h5><h5 class="sansserif">This title should be without serif</h5> <div class="footer"><p>start of footer section</p><p class="sansserif">this paragraph within footer is sans serif</p></div> you define a CLASS called sansserif, only one time, and you apply it to any element as shown above.Guy Link to comment Share on other sites More sharing options...
eduard Posted February 28, 2011 Author Share Posted February 28, 2011 Your problem is that you cannot write a style inside another one.Your style sheet should look likediv.footer{background-color:#6495ED;border-style:solid;border-color:#808080;border-width:5px;width:100%;height:15em;text-align:center;font-size:40px;color:#000000;}.sansserif{font-family:Arial,Helvetica,sans-serif;}h5{text-align:center;color:#000080;} and then your HTML <h5>This is a normal title</h5><h5 class="sansserif">This title should be without serif</h5> <div class="footer"><p>start of footer section</p><p class="sansserif">this paragraph within footer is sans serif</p></div> you define a CLASS called sansserif, only one time, and you apply it to any element as shown above.Guy As you can see I changed the code! The text: this website is made by´ is changed, but my name hasn´t!(www.eduardlid.com)a:link,a:visited{border-bottom-style:solid;border-color:#808080;color:#6A5ACD;text-decoration:none;display:block;background-color:#A9A9A9;width:8%;height:24%;text-align:center;padding:2px;}a:hover,a:active{background-color:#000000;}body{overflow:scroll;margin:0px;padding:0px;width:100%;}div.header{border-style:solid;border-width:5px;border-color:#808080;content:100%;width:100%;background-color:#6495ED;height:25em;padding:0px;}div#main{width:100%;height:32em;background-color:#ADD8E6;padding:0px;margin:0px;border:0px;}div.footer{background-color:#6495ED;border-style:solid;border-color:#808080;border-width:5px;width:100%;height:13em;text-align:center;font-size:40px;color:#000000;}.sansserif{font-family:Arial,Helvetica,sans-serif;}<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><HTML><head><meta http-equiv="content-type" content="text/ html; charset=UTF-8"><title>Eduard Lid</title><link rel="stylesheet" type="text/css" href="ex1.css"></head><body><div class="header"><a href="http://www.viadeo.com/es/profile/eduard.lid"><b><h4>Profile</h4></b></a><a href="web_designer/image_and_text_database.html"><b><h4>Web designer (databases)</h4></b></a></div><div id="main"><img src="images/me.JPG" alt="Eduard Lid" align="right" width="570" height="512"/></div><div class="footer"<h6>This website is made by ©</h6><h3>Eduard Lid</h3><h6>(1152*720px)</h6></div></body></HTML> Link to comment Share on other sites More sharing options...
thescientist Posted February 28, 2011 Share Posted February 28, 2011 I don't see you applying the sansserif class anywhere in your HTML. Link to comment Share on other sites More sharing options...
cousineaug Posted February 28, 2011 Share Posted February 28, 2011 .....<div class="footer" &&&&missing '>'<h6>This website is made by ©</h6><h3>Eduard Lid</h3><h6>(1152*720px)</h6></div></body></HTML> The footer class DIV has no close bracketIn my browser I cannot even see "this website made by" because of the errors"made by" is H6"Eduard" is H3but I see no style associated with these elements...so nothing should change. Link to comment Share on other sites More sharing options...
eduard Posted March 1, 2011 Author Share Posted March 1, 2011 As you can see I changed the code! The text: this website is made by´ is changed, but my name hasn´t!(www.eduardlid.com)a:link,a:visited{border-bottom-style:solid;border-color:#808080;color:#6A5ACD;text-decoration:none;display:block;background-color:#A9A9A9;width:8%;height:24%;text-align:center;padding:2px;}a:hover,a:active{background-color:#000000;}body{overflow:scroll;margin:0px;padding:0px;width:100%;}div.header{border-style:solid;border-width:5px;border-color:#808080;content:100%;width:100%;background-color:#6495ED;height:25em;padding:0px;}div#main{width:100%;height:32em;background-color:#ADD8E6;padding:0px;margin:0px;border:0px;}div.footer{background-color:#6495ED;border-style:solid;border-color:#808080;border-width:5px;width:100%;height:13em;text-align:center;font-size:40px;color:#000000;}.sansserif{font-family:Arial,Helvetica,sans-serif;}<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><HTML><head><meta http-equiv="content-type" content="text/ html; charset=UTF-8"><title>Eduard Lid</title><link rel="stylesheet" type="text/css" href="ex1.css"></head><body><div class="header"><a href="http://www.viadeo.com/es/profile/eduard.lid"><b><h4>Profile</h4></b></a><a href="web_designer/image_and_text_database.html"><b><h4>Web designer (databases)</h4></b></a></div><div id="main"><img src="images/me.JPG" alt="Eduard Lid" align="right" width="570" height="512"/></div><div class="footer"<h6>This website is made by ©</h6><h3>Eduard Lid</h3><h6>(1152*720px)</h6></div></body></HTML>I still don´t manage:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><HTML><head><meta http-equiv="content-type" content="text/ html; charset=UTF-8"><title>Eduard Lid</title><h5 class="sansserif">Eduard Lid</h5>.sansseriffont-family:Arial,Helvetica,sans-serif<link rel="stylesheet" type="text/css" href="ex1.css"></head><body><div class="header"><a href="http://www.viadeo.com/es/profile/eduard.lid"><b><h4>Profile</h4></b></a><a href="web_designer/image_and_text_database.html"><b><h4>Web designer (databases)</h4></b></a></div><div id="main"><img src="images/me.JPG" alt="Eduard Lid" align="right" width="400" height="257"/></div><div class="footer"><p>Eduard Lid</p><p class="sansserif"><h5>(1152*720px)</h5></div></body></HTML>a:link,a:visited{border-bottom-style:solid;border-color:#808080;color:#6A5ACD;text-decoration:none;display:block;background-color:#A9A9A9;width:9%;height:28%;text-align:center;padding:2px;}a:hover,a:active{background-color:#000000;}body{overflow:scroll;margin:0px;padding:0px;}div.header{border-style:solid;border-width:5px;border-color:#808080;content:100%;background-color:#6495ED;height:12em;padding:0px;}div#main{height:16em;background-color:#ADD8E6;padding:0px;margin:0px;border:0px;padding:0px;border:0px;}div.footer{background-color:#6495ED;border-style:solid;border-color:#808080;border-width:5px;height:7em;text-align:center;font-size:40px;color:#000000;}.sansserif{font-family:Arial,Helvetica,sans-serif;} Link to comment Share on other sites More sharing options...
thescientist Posted March 1, 2011 Share Posted March 1, 2011 first of all, this: <h5 class="sansserif">Eduard Lid</h5>.sansseriffont-family:Arial,Helvetica,sans-serif does not belong in the head. the class would if you put it in style tags, but since you have it as part of an external stylesheet, than its purpose there in unwarranted.if you were validating your webpage, you would have caught that error. (see my sig, or for added convenience, get the web developers toolbar for FF). to the other issue at hand, you're giving the sansserif class to an unclosed <p> tag. <p class="sansserif"> just add it as a class to the element you actually want to have that style. it's all in the tutorials.http://www.w3schools.com/css/css_id_class.asphttp://www.w3schools.com/css/css_font.asp Link to comment Share on other sites More sharing options...
eduard Posted March 1, 2011 Author Share Posted March 1, 2011 first of all, this:<h5 class="sansserif">Eduard Lid</h5>.sansseriffont-family:Arial,Helvetica,sans-serif does not belong in the head. the class would if you put it in style tags, but since you have it as part of an external stylesheet, than its purpose there in unwarranted.if you were validating your webpage, you would have caught that error. (see my sig, or for added convenience, get the web developers toolbar for FF). to the other issue at hand, you're giving the sansserif class to an unclosed <p> tag. <p class="sansserif"> just add it as a class to the element you actually want to have that style. it's all in the tutorials.http://www.w3schools.com/css/css_id_class.asphttp://www.w3schools.com/css/css_font.asp Thanks, although I have still the problem:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><HTML><head><meta http-equiv="content-type" content="text/ html; charset=UTF-8"><title>Eduard Lid</title><link rel="stylesheet" type="text/css" href="ex1.css"></head><body><div class="header"><a href="http://www.viadeo.com/es/profile/eduard.lid"><b><h4>Profile</h4></b></a><a href="web_designer/image_and_text_database.html"><b><h4>Web designer (databases)</h4></b></a></div><div id="main"><img src="images/me.JPG" alt="Eduard Lid" align="right" width="400" height="257"/></div><div class="footer"><p>Eduard Lid</p>.p font{font:sansserif;}<h5>(1152*720px)</h5></div></body></HTML> Link to comment Share on other sites More sharing options...
thescientist Posted March 1, 2011 Share Posted March 1, 2011 yes, I can see that. It appears you aren't following any of the advice or reading the tutorials. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.