CSS Customization Problem

  • I am trying to create a custom class for my Shoutbox themed website, but am having difficulty making it work. Here is the steps I have done:

    I have inputted this code in my custom.css file:

    #quote-container
{
	margin: auto;
	width: 620px;
	background: #B01327;
	padding: 5px
}

.thequote {
	font-family: "Times New Roman", Times, serif;
	font-size: 20pt;
	color: #FFFFFF;
	font-weight: bold;
}
.theauthor {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: #000000;
	font-style: italic;

    And I have added this code in the content area:

    <div id="quote-container">
<p class="thequote">A woman's head is always influenced by heart; but a man's heart by his head.</p>
<p class="theauthor">- Lady Marguerite Gardiner Blessington</p>
</div>

    The result is this: (no change to the content)
    https://greatestlovequotes.com/love-quotes-by-lady-marguerite-gardiner-blessington-32/

    Any thoughts on what I might be doing wrong? Any help would be much appreciated. Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator Jose Castaneda

    (@jcastaneda)

    THEME COFFEE MONKEY

    The one issue I can see right off the bat is that the width you are trying to use for the quote will be cut off and second is the fact that there is no id or class in any of your css that I could find.

    Thread Starter encompassmore

    (@encompassmore)

    jcastaneda,

    Thanks for the reply! As far as the width, that is the width of the slideshow on the page, so that should be OK.

    As for the id or class, could you, perchance, give me an example of what you mean. I am new to css. To me, I have the Id as “quote-container” and the class as “thequote” and “theauthor.”

    Should I be doing something more? Thanks for you help.

    Thread Starter encompassmore

    (@encompassmore)

    I just tried this experiment to see if this worked:

    <html>
<head>
<style>

p#exampleID1 { background-color: blue; }
p#exampleID2 { text-transform: uppercase; } 

</style>
</head>
<body>
<p id="exampleID1">This paragraph has an ID name of "exampleID1" and has a blue CSS defined background.</p>
<p id="exampleID2">This paragraph has an ID name of "exampleID2" and has had its text transformed to uppercase letters.</p>
</body>
</html>

    Result here:
    https://greatestlovequotes.com/love-quotes-by-lady-marguerite-gardiner-blessington-32/

    The blue background does not work, but the transform case does. Can a theme designer dampen certain customizations?

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘CSS Customization Problem’ is closed to new replies.

Tags