Graeme Posted August 14, 2010 Report Share Posted August 14, 2010 Hello All, I came across a template and I'm busy trying to adapt it. I've basically altered most things to suit but there are some I just don't understand! I can't seem to alter the text colour in div.story and there is a thick black line that shows up in img above the menu. I know the background of img is black but even if I alter the border it shows in Firefox but not in IE. Other than that I'm really pleased. (just when you start to think you are getting to grips with CSS!). Thank you as always, Best wishes Graeme Quote Link to comment Share on other sites More sharing options...
Graeme Posted August 14, 2010 Author Report Share Posted August 14, 2010 Woops, Temp URL is http://www.btinternet.com/~gj.d/bits/index.html Thank you [#uote name=Graeme' date='14 August 2010 - 11:15 PM' timestamp='1281824125' post='18753] Hello All, I came across a template and I'm busy trying to adapt it. I've basically altered most things to suit but there are some I just don't understand! I can't seem to alter the text colour in div.story and there is a thick black line that shows up in img above the menu. I know the background of img is black but even if I alter the border it shows in Firefox but not in IE. Other than that I'm really pleased. (just when you start to think you are getting to grips with CSS!). Thank you as always, Best wishes Graeme Quote Link to comment Share on other sites More sharing options...
newseed Posted August 14, 2010 Report Share Posted August 14, 2010 The text color is defined in the body element (not #body). Go ahead and add the color to your .story class and it will override the body color. Otherwise, just change the body element color. As for the image, just give that image a display: block. Then adjust your border for #menu. border: 2px solid #000000; border-top: 2px solid #000000; border-bottom: 0px solid #000000; Quote Link to comment Share on other sites More sharing options...
falkencreative Posted August 14, 2010 Report Share Posted August 14, 2010 On #Image, if you add line-height:0; that will take care of part of the black line. You do have 2px black top border on #menu that you'll need to remove in order to take care of that completely. Quote Link to comment Share on other sites More sharing options...
Graeme Posted August 15, 2010 Author Report Share Posted August 15, 2010 Hello Friends, Thank you so much. I've just had another lesson in CSS! Should I alter the body or the body. story? Where does the Font Size: 13px come from? Thanks again, Best wishes Graeme Quote Link to comment Share on other sites More sharing options...
newseed Posted August 15, 2010 Report Share Posted August 15, 2010 (edited) Always set your default font to the body element and then apply any styles to id's or classes that you desire to override the default. As for the font size 13px, you have none in the css and so the size is probably being rendered by the browser's default font settings. Update: default.css I have attached a default.css file with all the default settings. You will also find this in the CSS forum which was originally submitted by John. Edited August 15, 2010 by newseed Quote Link to comment Share on other sites More sharing options...
Graeme Posted August 15, 2010 Author Report Share Posted August 15, 2010 Thank you so much, I really appreciate it. So should I add the size of the font etc into the body div? Best wishes Graeme Quote Link to comment Share on other sites More sharing options...
newseed Posted August 15, 2010 Report Share Posted August 15, 2010 Try both and see the results for each. Otherwise, just add the font size to the .story class. Tip: You ought to make a backup copy of your css and then experiment...experiment...experiment with your css to see what it does. Trying things out may surprise you in what you might learn on your own. Quote Link to comment Share on other sites More sharing options...
Graeme Posted August 17, 2010 Author Report Share Posted August 17, 2010 Hello, Thank you for all this. I'm trying to experiment with the CSS as you suggest, it's a great way to learn. I Validate the page and it's great to see only one error as I set it up, the only ting is I don't understand the error! It reads Line 32, Column 25: end tag for "br" omitted, but OMITTAG NO was specified <h2>1st build</h2><br>✉ You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">". Line 32, Column 21: start tag was here <h2>1st build</h2><br> Thank you, Best wishes Graeme Quote Link to comment Share on other sites More sharing options...
Andrea Posted August 17, 2010 Report Share Posted August 17, 2010 Your doctype is XHTML, right? Then you need a <br /> instead of a <br> - these breaks, btw, should not be used to create space, that's what margins and padding are for. Quote Link to comment Share on other sites More sharing options...
Graeme Posted August 17, 2010 Author Report Share Posted August 17, 2010 Hello, But it looks like the <br> is an opening tag! Best wishes Graeme Quote Link to comment Share on other sites More sharing options...
Andrea Posted August 17, 2010 Report Share Posted August 17, 2010 some tags don't really have opening and closing tags - like <br>, <img>, etc. For those, when you use XHTML doctype, you have to build the closing slash right in: <br /> or <img src="whatever.jpg" /> Quote Link to comment Share on other sites More sharing options...
Graeme Posted August 18, 2010 Author Report Share Posted August 18, 2010 Hi Andrea, So whre do I put the /> in <div id="body"> <div class="story"> <h2>1st build</h2><br> <p>Every company requires to consistently attract new customers as well as new business in order to reach its ultimate potential. This is where a press ad design can help you. However with businesses frequently advertising within inches of each other in selected publications, it is quite possible that your ad may be easily overlooked. <br /> </div> Thank you, Best wishes Graeme Quote Link to comment Share on other sites More sharing options...
newseed Posted August 18, 2010 Report Share Posted August 18, 2010 So whre do I put the /> in <div id="body"> <div class="story"> <h2>1st build</h2><br /> <p>Every company requires to consistently attract new customers as well as new business in order to reach its ultimate potential. This is where a press ad design can help you. However with businesses frequently advertising within inches of each other in selected publications, it is quite possible that your ad may be easily overlooked. <br /> </div> Quote Link to comment Share on other sites More sharing options...
Andrea Posted August 18, 2010 Report Share Posted August 18, 2010 I would, however, suggest this: <div id="body"> <div class="story"> <h2>1st build</h2><br /> <p>Every company requires to consistently attract new customers as well as new business in order to reach its ultimate potential. This is where a press ad design can help you. However with businesses frequently advertising within inches of each other in selected publications, it is quite possible that your ad may be easily overlooked. <br /> </p> </div> ] (I'd think you'll need the closing p tag anyway to validate) and CSS: h2 {margin-bottom: 15px;} p {margin-bottom: 10px;} (# of pixels is random - just to whatever space you need) Quote Link to comment Share on other sites More sharing options...
Graeme Posted August 18, 2010 Author Report Share Posted August 18, 2010 thanks and thanks again, best wishes graeme 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.