Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts

    Exclamation I cannot change the text color.

    I am haveing trouble trying to change the colour of this text-
    Frank's den - where it all happens
    on this site.

    Any help appreciated.

    Frank

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Opening page of the Taylor websiteb.</title>
    <base href="http://exitfegs.co.uk/">
    <link rel="stylesheet" type="text/css" href="websiteb.css" />
    <style type="text/css">
    * {
    margin:0;
    padding:0;
    }
    html, body {
    background-color:#200;
    color:#FFF;
    font-family:11px Arial, Helvetica, sans-serif;
    font-weight:700;
    height:100%;
    width:100%;
    }
    #cap {
    color:#FF0;
    float:left;
    font-size:50px;
    font-weight:700;
    height:34px;
    line-height:24px;
    margin-right:1px;
    margin-top:2px;
    }
    #clockbox0 {
    color:#dd0;
    font-weight:700;
    left:3em;
    position:absolute;
    }
    #clockbox1 {
    color:#dd0;
    font-weight:700;
    position:absolute;
    right:3em;
    }
    #header {
    left:120px;
    margin:10px;
    position:fixed;
    }
    #header h1 {
    color:red;
    text-align:center;
    }
    #imgcaption {
    color:black;
    font-size:.8em;
    margin:0 25% 0 0;
    text-align:center;
    }
    #imgcaption2 {
    color:#000;
    font-size:.8em;
    margin:10px;
    text-align:center;
    }
    #intro {
    color:#FFF;
    float:left;
    width:165px;
    }
    #intro p {
    margin:0;
    padding:0;
    }
    #links {
    background-color:#300;
    color:#FFF;
    float:left;
    font:.6em Arial, Helvetica, sans-serif;
    line-height:1.2;
    margin:40px 0 0 0 0;
    padding:5px;
    text-align:left;
    text-decoration:none;
    width:200px;
    }
    #links ul {
    color:#FFF;
    list-style:none;
    margin:0;
    padding-left:3px;
    }
    #links ul a {
    color:#FFF;
    font-size:1.3em;
    font-weight:400;
    text-decoration:none;
    }
    #links ul a:hover {
    text-decoration:underline;
    }
    #links ul li {
    padding-left:20px;
    }
    #main {
    background:url(59.jpg) no-repeat ;
    }
    * html #main {
    height:480px;
    }
    #main a img {
    border:2px solid #FFF;
    }
    #main a:hover img {
    border-color:orange;
    }
    #main p {
    color:#fff;
    text-align:center;
    }
    #valids {
    clear:both;
    margin:auto;
    padding:2px;
    width:176px;
    }
    #wrap {
    margin:auto;
    position:relative;
    min-width:950px;
    }
    * html #cap {
    margin-right:-2px;
    margin-top:3px;
    }
    .capital {
    background:#000;
    color:#FFF;
    float:left;
    font:78px/35px Arial, Helvetica, sans-serif;
    padding-bottom:12px;
    }
    .clear {
    clear:both;
    line-height:0;
    font-size:0;
    }
    .h1 {
    font-size:15px;
    }
    .p, a:visited {
    color:#FFF;
    }
    a img {
    border:none;
    }
    a:link, a:active {
    color:#00F;
    }
    h1 {
    color:#00ee00;
    font-size:24px;
    text-align:center;
    padding:0 4% 1% 0;
    }
    li.nobullet, li.nobullet ul li {
    list-style:none;
    }
    
    </style>
    <script type="text/javascript" src="include.js"></script>
    <!--[if lt IE 8]>
    	<script type="text/javascript" src="http://ie7-js.googlecode.com/svn/version/7.0.6001.18000/IE8.js" ></script>
    <![endif]-->
    </head>
    <body>
    <div id="wrap"> <span id="clockbox0"></span><span id="clockbox1"></span><br>
    	<h1 id="greet">
    		<script type="text/javascript">
      greet();
      </script>
    	</h1>
    	<div id="links">
    		<ul>
    			<li><A href="two.html">Betty and Frank.</a></li>
    			<li><A href="three.html">Little Ted and Dmitri.</a></li>
    			<li><A href="four.html">Lovely Betty and Pussycat.</a></li>
    			<li><A href="five.html">Betty and the Bears.</a></li>
    			<li><A href="seven.html">Steven and Joyce and Mark.</a></li>
    			<li><A href="twelve.html">Ritcroft family group.</a></li>
    			<li><A href="Eddie.html">Eddie, relaxing at home.</a></li>
    			<li><A href="Bluebell1.html">Steven at ease.</a></li>
    			<li><A href="Steveintrain.html">Steve on the Bluebell Line.</a></li>
    			<li><A href="steveviewing.html">Steve at the box.</a></li>
    			<li><A href="Barker.html">Claire, Yvonne and Susan.</a></li>
    			<li><A href="xmas2006.html">Christmas 2006 at Yvonne's.</a></li>
    			<li><A href="nine.html">Family pictures.</a></li>
    			<li><A href="hol1.html">Holiday snaps.</a></li>
    			<li><A href="alifetime.html">A life span.</a></li>
    			<li><a href="web19large.html">In the middle of the above.</a></li>
    			<li><A href="LittleBoyBlue.html">Little Boy Blue</a></li>
    			<li><A href="Tarantella.html">Do you remember an inn.</a></li>
    			<li>(One of Betty's favourite poems.)</li>
    		</ul>
    		<br>
    		<ul>
    			<li><A href="Picchoose.html">Picture menu - complete.</a></li>
    			<li><A href="Picchoosea.html">Picture menu part 1.</a></li>
    			<li><A href="Picchooseb.html">Picture menu part 2.</a></li>
    			<li><A href="Picchoosec.html">Picture menu part 3.</a></li>
    			<li><A href="steve.html">Steven.</a></li>
    			<li><A href="frwall1.html">The Lounge.</a></li>
    			<li><A href="Alice.html">Alice.</a></li>
    			<li><A href="Sources.html">Useful.</a></li>
    			<li>Updated 10th November,2008</li>
    		</ul>
    	</div>
    	<div id="main">
    		<p id="imgcaption">Frank's den - where it all happens.</p>
    	</div>
    	<div class="clear">&nbsp;</div>
    </div>
    </body>
    </html>
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #2
    Senior Coder rangana's Avatar
    Join Date
    Feb 2008
    Location
    Cebu City, Philippines
    Posts
    1,752
    Thanks
    65
    Thanked 372 Times in 365 Posts
    Don't ask me why, but at times like this, digging through the element (usually) helps:
    Code:
    #main #imgcaption {
    color:black;
    font-size:.8em;
    margin:0 25% 0 0;
    text-align:center;
    }
    Learn how to javascript at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph

  • #3
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Your CSS
    #main p {/*index.html (line 115)*/
    color:#FFFFFF;
    text-align:center;
    }
    #main p {/*websiteb.css (line 109) this is actually an unwanted repeat*/
    color:#FFFFFF;
    text-align:center;
    }
    overrides your

    Code:
    #imgcaption {/*index.html (line 52)*/
    color:black;
    font-size:0.8em;
    margin:2% 2% 0pt 0pt;
    text-align:center;
    }
    So, to apply the desired effect you'd need to choose a more specific selector. See http://htmldog.com/guides/cssadvanced/specificity/
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •