Why is text in my Content Editor always bold?
Permalink
Hi all,
Strange issue, when I'm adding or editing text in the Content Editor all text always shows up bold in the editor window. When I click update it's find and it publishes the text in normal or bold depending on what you've selected. It's confusing trying to show people how to edit text though, is this normal or should the window show text in both bold and normal weights? I've built four or five c5 sites and it's always done this.
Thanks,
John
Strange issue, when I'm adding or editing text in the Content Editor all text always shows up bold in the editor window. When I click update it's find and it publishes the text in normal or bold depending on what you've selected. It's confusing trying to show people how to edit text though, is this normal or should the window show text in both bold and normal weights? I've built four or five c5 sites and it's always done this.
Thanks,
John
It could be your themes css overriding the default.
Text is shown within the tiny mce (context editor) according to the css within the typography.css file.
try adding the following rules into your typography.css and see if it has any effects.
try adding the following rules into your typography.css and see if it has any effects.
p { font-weight:normal; } strong { font-weight:bold; }
and if guyhomas css dosent work for some reason, then apply this code
p{
font-weight:normal!important;
}
strong{
font-weight:bold!important;
}
the "!important" overrits all :-)
/Mike
p{
font-weight:normal!important;
}
strong{
font-weight:bold!important;
}
the "!important" overrits all :-)
/Mike
Sorry guy none of these two suggestions worked I'm afraid. Here's how I've set my H3 if it helps you see any potential problems.
Thanks, John
h3 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 18px;
color: #2b2b2b;
padding-right: 15px;
padding-left: 25px;
padding-top: 5px;
padding-bottom: 5px;
font-weight: normal;
margin: 0px;
}
Thanks, John
h3 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 18px;
color: #2b2b2b;
padding-right: 15px;
padding-left: 25px;
padding-top: 5px;
padding-bottom: 5px;
font-weight: normal;
margin: 0px;
}
Can you post the entire contents of your typography.css file?
Thanks Guy, I've just used the same css file for both typography and layout.
Your help is much appreciated.
John
#wrapper {
height: auto;
width: 950px;
margin-right: auto;
margin-left: auto;
position: relative;
background-color: #FFFFFF;
}
#image {
height: 285px;
width: 950px;
position: relative;
}
#content {
height: auto;
width: 950px;
position: relative;
background-color: #FFFFFF;
background-image: url(images/white.png);
background-repeat: repeat-y;
}
#text {
float: left;
height: auto;
width: 704px;
position: relative;
background-color: #FFFFFF;
background-image: url(images/white.png);
background-repeat: repeat-y;
}
#social {
height: auto;
width: 246px;
position: absolute;
background-image: url(images/special.png);
background-repeat: no-repeat;
background-color: #FFFFFF;
left: 700px;
top: 0px;
}
#footer {
background-color: #000000;
background-image: url(images/footer.png);
height: 145px;
width: 950px;
position: relative;
clear:left;
}
#header {
height: 165px;
width: 950px;
position: relative;
}
#logomain {
float: left;
height: 165px;
width: 210px;
position: relative;
background-color: #ec008c;
}
#topright {
float: right;
height: 165px;
width: 740px;
position: relative;
}
#top {
height: 85px;
width: 740px;
position: relative;
background-image: url(images/top.jpg);
background-color: #ec008c;
}
#choose {
height: 38px;
width: 740px;
position: relative;
background-image: url(images/choose.jpg);
background-color: #ec008c;
}
#areachoice {
height: 14px;
width: 240px;
position: absolute;
left: 500px;
top: 8px;
}
#topmenu {
height: 42px;
width: 740px;
position: relative;
background-color: #c70076;
}
#topnavdiv {
height: 25px;
width: 720px;
position: absolute;
top: 10px;
right: 0px;
}
ul.nav li {
list-style: none;
display:inline;
}
ul.nav li a {
text-decoration: none;
font-family: 'Terminal Dosis', sans-serif;
font-weight:700;
font-size: 17px;
color: #fff;
text-align: right;
margin: 0;
padding: 4px 12px 4px 12px;
}
ul.nav {
width: 100%;
margin: 0px;
padding: 0px;
}
ul.nav a:hover {
color: #fff;
background: #45a1e9;
}
#footmenu {
padding-left: 0;
margin-left: 0;
}
#footmenu li {
list-style: none;
display:inline;
}
#footmenu li a {
text-decoration: none;
font-family: 'Terminal Dosis', sans-serif;
font-weight:700;
font-size: 10px;
color: #fff;
text-align: left;
display: block;
margin: 0;
padding: 2px 2px 2px 2px;
}
#footmenu {
width: 100%;
margin: 0px 0px 0px 0px;
padding: 0 0 0 0;
}
#footmenu a:hover {
color: #FFF;
background: #ec008c;
}
#copy {
height: 15px;
width: 400px;
position: absolute;
left: 100px;
top: 112px;
}
#cc li {
list-style: none;
display:inline;
}
#cc li a {
text-decoration: none;
font-family: 'Terminal Dosis', sans-serif;
font-weight:700;
font-size: 11px;
color: #fff;
padding: 3px 3px 3px 3px;
text-align:right;
}
#cc {
width: 600px;
margin: 0px 0px 0px 0px;
padding: 0 0 0 0;
}
#cc a:hover {
color: #FFF;
background: #ec008c;
}
p {
margin-top: -5px;
}
#f-two {
height: 90px;
width: 190px;
position: absolute;
left: 70px;
top: 13px;
}
#f-three {
height: 90px;
width: 200px;
position: absolute;
left: 288px;
top: 13px;
}
#f-four {
height: 90px;
width: 160px;
position: absolute;
left: 513px;
top: 13px;
}
h1 {
font-family: 'Terminal Dosis', sans-serif;
font-weight:700;
font-size: 26px;
line-height: 29px;
color: #4a4a4a;
padding-right: 15px;
padding-left: 25px;
padding-top: 52px;
padding-bottom: 10px;
margin: 0px;
letter-spacing: -0.7px;
}
h2 {
font-family: 'PT Sans Narrow', sans-serif;
font-size: 24px;
line-height: 24px;
color: #1581d5;
padding-right: 15px;
padding-left: 25px;
padding-top: 0px;
padding-bottom: 0px;
font-weight: bold;
}
h3 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 18px;
color: #2b2b2b;
padding-right: 15px;
padding-left: 25px;
padding-top: 5px;
padding-bottom: 5px;
font-weight: normal;
margin: 0px;
}
.voucher-list {
height: 97px;
width: 673px;
border:solid 1px black;
margin-right: auto;
margin-left: auto;
background-color: #fff;
margin-left: 20px;
margin-top: 0px;
margin-bottom: 10px;
}
.logo {
position: absolute;
padding: 10px;
}
.mainheadline {
font-family: 'PT Sans Narrow', sans-serif;
font-weight: bold;
font-size: 24px;
color: #000;
padding-left: 170px;
padding-top: 10px;
padding-bottom: 5px;
margin: 0px;
}
.validfrom {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 14px;
color: #666666;
padding-left: 170px;
padding-top: 15px;
margin: 0px;
}
.shopaddress {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 14px;
color: #666666;
padding-left: 470px;
margin: 20px;
}
.validinfo {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 14px;
color: #666666;
padding-left: 170px;
margin: 0px;
}
.button {
padding-left: 517px;
margin: -37px;
}
li
{
list-style-type: none;
}
.vip-standard-voucher {
height: 295px;
width: 673px;
border:dashed 2px black;
margin-right: auto;
margin-left: auto;
background-color: #fff;
margin-left: 20px;
margin-top: 0px;
margin-bottom: 10px;
}
.top-text {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-align:center;
color: #e9008a;
padding-left: 0px;
padding-top: 0px;
height: 40px;
width: 670px;
margin-top: 5px;
text-transform: uppercase;
}
.customer-logo {
padding-left: 5px;
padding-top: 5px;
margin-top: -25px;
}
.voucher-headline {
font-family: 'PT Sans Narrow', sans-serif;
font-weight: bold;
font-size: 34px;
line-height: 34px;
text-align:center;
color: #333333;
padding-left: 250px;
height: 40px;
width: 400px;
margin-top: -100px;
}
.voucher-address {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 15px;
line-height: 18px;
text-align:center;
color: #333333;
padding-left: 0px;
padding-top: 0px;
height: 40px;
width: 670px;
margin-top: 50px;
}
.vip-voucher-logo {
padding-left: 5px;
padding-top: 25px;
}
.voucher-terms {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: normal;
font-size: 10px;
line-height: 12px;
text-align:center;
color: #333333;
padding-left: 130px;
padding-top: 0px;
height: 40px;
width: 500px;
margin-top: -50px;
}
ul.sections {
margin: 0;
padding: 0px 0px 0px 0px;
}
ul.sections li {
list-style: none;
padding: 0;
display: inline;
}
ul.sections li a {
text-decoration: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #c60076;
display: block;
border-bottom: 1px solid #dedede;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 45px;
background-image:url(images/arrow1.gif);
background-repeat: no-repeat;
background-position: 16px 3px;
text-transform: uppercase;
font-weight: bold;
width: 600px;
}
ul.sections a:hover {
color: #000;
background: #fff;
background-image:url(images/arrow2.gif);
background-repeat: no-repeat;
background-position: 16px 3px;
}
p{
font-weight:normal!important;
}
strong{
font-weight:bold!important;
}
Your help is much appreciated.
John
#wrapper {
height: auto;
width: 950px;
margin-right: auto;
margin-left: auto;
position: relative;
background-color: #FFFFFF;
}
#image {
height: 285px;
width: 950px;
position: relative;
}
#content {
height: auto;
width: 950px;
position: relative;
background-color: #FFFFFF;
background-image: url(images/white.png);
background-repeat: repeat-y;
}
#text {
float: left;
height: auto;
width: 704px;
position: relative;
background-color: #FFFFFF;
background-image: url(images/white.png);
background-repeat: repeat-y;
}
#social {
height: auto;
width: 246px;
position: absolute;
background-image: url(images/special.png);
background-repeat: no-repeat;
background-color: #FFFFFF;
left: 700px;
top: 0px;
}
#footer {
background-color: #000000;
background-image: url(images/footer.png);
height: 145px;
width: 950px;
position: relative;
clear:left;
}
#header {
height: 165px;
width: 950px;
position: relative;
}
#logomain {
float: left;
height: 165px;
width: 210px;
position: relative;
background-color: #ec008c;
}
#topright {
float: right;
height: 165px;
width: 740px;
position: relative;
}
#top {
height: 85px;
width: 740px;
position: relative;
background-image: url(images/top.jpg);
background-color: #ec008c;
}
#choose {
height: 38px;
width: 740px;
position: relative;
background-image: url(images/choose.jpg);
background-color: #ec008c;
}
#areachoice {
height: 14px;
width: 240px;
position: absolute;
left: 500px;
top: 8px;
}
#topmenu {
height: 42px;
width: 740px;
position: relative;
background-color: #c70076;
}
#topnavdiv {
height: 25px;
width: 720px;
position: absolute;
top: 10px;
right: 0px;
}
ul.nav li {
list-style: none;
display:inline;
}
ul.nav li a {
text-decoration: none;
font-family: 'Terminal Dosis', sans-serif;
font-weight:700;
font-size: 17px;
color: #fff;
text-align: right;
margin: 0;
padding: 4px 12px 4px 12px;
}
ul.nav {
width: 100%;
margin: 0px;
padding: 0px;
}
ul.nav a:hover {
color: #fff;
background: #45a1e9;
}
#footmenu {
padding-left: 0;
margin-left: 0;
}
#footmenu li {
list-style: none;
display:inline;
}
#footmenu li a {
text-decoration: none;
font-family: 'Terminal Dosis', sans-serif;
font-weight:700;
font-size: 10px;
color: #fff;
text-align: left;
display: block;
margin: 0;
padding: 2px 2px 2px 2px;
}
#footmenu {
width: 100%;
margin: 0px 0px 0px 0px;
padding: 0 0 0 0;
}
#footmenu a:hover {
color: #FFF;
background: #ec008c;
}
#copy {
height: 15px;
width: 400px;
position: absolute;
left: 100px;
top: 112px;
}
#cc li {
list-style: none;
display:inline;
}
#cc li a {
text-decoration: none;
font-family: 'Terminal Dosis', sans-serif;
font-weight:700;
font-size: 11px;
color: #fff;
padding: 3px 3px 3px 3px;
text-align:right;
}
#cc {
width: 600px;
margin: 0px 0px 0px 0px;
padding: 0 0 0 0;
}
#cc a:hover {
color: #FFF;
background: #ec008c;
}
p {
margin-top: -5px;
}
#f-two {
height: 90px;
width: 190px;
position: absolute;
left: 70px;
top: 13px;
}
#f-three {
height: 90px;
width: 200px;
position: absolute;
left: 288px;
top: 13px;
}
#f-four {
height: 90px;
width: 160px;
position: absolute;
left: 513px;
top: 13px;
}
h1 {
font-family: 'Terminal Dosis', sans-serif;
font-weight:700;
font-size: 26px;
line-height: 29px;
color: #4a4a4a;
padding-right: 15px;
padding-left: 25px;
padding-top: 52px;
padding-bottom: 10px;
margin: 0px;
letter-spacing: -0.7px;
}
h2 {
font-family: 'PT Sans Narrow', sans-serif;
font-size: 24px;
line-height: 24px;
color: #1581d5;
padding-right: 15px;
padding-left: 25px;
padding-top: 0px;
padding-bottom: 0px;
font-weight: bold;
}
h3 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 18px;
color: #2b2b2b;
padding-right: 15px;
padding-left: 25px;
padding-top: 5px;
padding-bottom: 5px;
font-weight: normal;
margin: 0px;
}
.voucher-list {
height: 97px;
width: 673px;
border:solid 1px black;
margin-right: auto;
margin-left: auto;
background-color: #fff;
margin-left: 20px;
margin-top: 0px;
margin-bottom: 10px;
}
.logo {
position: absolute;
padding: 10px;
}
.mainheadline {
font-family: 'PT Sans Narrow', sans-serif;
font-weight: bold;
font-size: 24px;
color: #000;
padding-left: 170px;
padding-top: 10px;
padding-bottom: 5px;
margin: 0px;
}
.validfrom {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 14px;
color: #666666;
padding-left: 170px;
padding-top: 15px;
margin: 0px;
}
.shopaddress {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 14px;
color: #666666;
padding-left: 470px;
margin: 20px;
}
.validinfo {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 14px;
color: #666666;
padding-left: 170px;
margin: 0px;
}
.button {
padding-left: 517px;
margin: -37px;
}
li
{
list-style-type: none;
}
.vip-standard-voucher {
height: 295px;
width: 673px;
border:dashed 2px black;
margin-right: auto;
margin-left: auto;
background-color: #fff;
margin-left: 20px;
margin-top: 0px;
margin-bottom: 10px;
}
.top-text {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-align:center;
color: #e9008a;
padding-left: 0px;
padding-top: 0px;
height: 40px;
width: 670px;
margin-top: 5px;
text-transform: uppercase;
}
.customer-logo {
padding-left: 5px;
padding-top: 5px;
margin-top: -25px;
}
.voucher-headline {
font-family: 'PT Sans Narrow', sans-serif;
font-weight: bold;
font-size: 34px;
line-height: 34px;
text-align:center;
color: #333333;
padding-left: 250px;
height: 40px;
width: 400px;
margin-top: -100px;
}
.voucher-address {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 15px;
line-height: 18px;
text-align:center;
color: #333333;
padding-left: 0px;
padding-top: 0px;
height: 40px;
width: 670px;
margin-top: 50px;
}
.vip-voucher-logo {
padding-left: 5px;
padding-top: 25px;
}
.voucher-terms {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: normal;
font-size: 10px;
line-height: 12px;
text-align:center;
color: #333333;
padding-left: 130px;
padding-top: 0px;
height: 40px;
width: 500px;
margin-top: -50px;
}
ul.sections {
margin: 0;
padding: 0px 0px 0px 0px;
}
ul.sections li {
list-style: none;
padding: 0;
display: inline;
}
ul.sections li a {
text-decoration: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #c60076;
display: block;
border-bottom: 1px solid #dedede;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 45px;
background-image:url(images/arrow1.gif);
background-repeat: no-repeat;
background-position: 16px 3px;
text-transform: uppercase;
font-weight: bold;
width: 600px;
}
ul.sections a:hover {
color: #000;
background: #fff;
background-image:url(images/arrow2.gif);
background-repeat: no-repeat;
background-position: 16px 3px;
}
p{
font-weight:normal!important;
}
strong{
font-weight:bold!important;
}
See what happens if you delete everything from the file but the last two rules.
For most people, you can throw out any rule that has a class (.) or id (#) in it.
For most people, you can throw out any rule that has a class (.) or id (#) in it.
Hi Guy, I tried that and all of the layout went to pot but when I managed to find the text block it was exactly the same, all bold.
Have you tried clearing your sites cache after making adding the css to the typography.css, sometimes the changes are not immediately reflected in TinyMCE
Your layout shouldn't break when you edit the typography.css file.
Can you create a new content block, open it in edit mode, type a few sentences with some bold, etc thrown in there, and then take a screenshot?
You said all of your layout css was duplicated in both your main.css and your typography.css?
Can you create a new content block, open it in edit mode, type a few sentences with some bold, etc thrown in there, and then take a screenshot?
You said all of your layout css was duplicated in both your main.css and your typography.css?
I don't have a main.css and a typography.css file. I'm new to concrete5 and have done it the way I saw on a c5 video tutorial. All of my css is on a default.css file (both positional and typography).
Thanks again.
John
Thanks again.
John
Create a typography.css file in your theme directory. Add the rules we specified and see what happens.
Guy
Guy
Nothing happened I'm afraid, no change. Stumped...
you may also need to edit your theme so the typography.css file is loaded.
Is this right? This is what I did –
<? Loader::element('header_required'); ?>
<link href="<?=$this->getThemePath()?>/default.css" rel="stylesheet" type="text/css" />
<link href="<?=$this->getThemePath()?>/typography.css" rel="stylesheet" type="text/css" />
<? Loader::element('header_required'); ?>
<link href="<?=$this->getThemePath()?>/default.css" rel="stylesheet" type="text/css" />
<link href="<?=$this->getThemePath()?>/typography.css" rel="stylesheet" type="text/css" />
That looks right.
If that still didn't do anything switch over to the plain yogurt theme and see how that behaves.
If that still didn't do anything switch over to the plain yogurt theme and see how that behaves.
