MyBB Community Forums

Full Version: Get Rid Of Blurry Quote Text
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
I've been trying to figure out why my blockquote text is so blurry. I've messed around with my global.css file but I still can't get rid of the blurriness.

I'm using the "Personal" theme with modifications.

You can see what I mean by blurry text here (the quoted text looks like it has a shadow):
http://how-to-sing.net/forum/Thread-Site-Makeover

Here is my global.css file:
body {
	background: #3d3d3d url(images/small_background3.jpg) repeat;
	color: #51a1b3;
	font-family: Verdana, Arial, Sans-Serif;
	font-size: 15px;
	text-align: center; /* IE 5 fix */
	line-height: 1.4;
        margin: auto;
        padding: 40px;
}

a:link {
	color: #ffffff;
	text-decoration: none;
}

a:visited {
	color: #ffffff;
	text-decoration: none;
}

a:hover, a:active {
	color: #16b0c2;
	text-decoration: underline;
}

#container {
	width: 990px;
	background: #616161;
	border: 1px solid #262626;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
	color: #FFFFFF;
        text-shadow: 1px #3a3a3a;
        margin-top: -20px;
	margin: auto auto;
        margin-bottom: 20px;
	padding: 20px;
        font-family: Copperplate / Copperplate Gothic Light, sans-serif;
	text-align: left; /* IE 5 fix */
}

#content {
	/* FIX: Make internet explorer wrap correctly */
	width: auto !important;
}

.menu {
       	background: url(images/pl/mn_pl.png) repeat-x;
	border: 1px solid #55c3d0;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
        height: 32px;
}

.menu ul {
	color: #083e4c;
	font-weight: bold;
	text-align: left;
	padding: 4px;
}

.menu ul a:link {
	color: #083e4c;
	text-decoration: none;
}

.menu ul a:visited {
	color: #083e4c;
	text-decoration: none;
}

.menu ul a:hover, .menu ul a:active {
	color: #083e4c;
	text-decoration: underline;
}

#panel {
	background: #108ba7 url(images/pl/pn_pl.png) repeat-x;
	width: 400px;
	color: #083e4c;
	margin-top: 4px;
	border: 1px solid #55c3d0;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	border-radius: 10px 10px 10px 10px;
	padding: 8px;
	margin-top: 25px;
	float: right;
	overflow: hidden;
	height: 70px;
	
	font-size: 11px;
}

#panel .remember_me input {
	vertical-align: middle;
	margin-top: -1px;
}

#panel a:link {
	color: #083e4c;
        padding: 1px;
	text-decoration: none;
}

#panel a:visited {
	color: #083e4c;
        padding: 1px;
	text-decoration: none;
}

#panel a:hover, .menu ul a:active {
	color: #083e4c;
        padding: 1px;
	text-decoration: underline;
}

table {
	color: #ffffff;
	font-family: Verdana, Arial, Sans-Serif;
	font-size: 15px;
letter-spacing: 0px;
text-shadow: black 0.1em 0.1em 0.2em;
}

.tborder {
	background: #3d3d3d;
	width: 100%;
	margin: auto auto;
        padding: 3px;
	border: 1px solid #262626;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
}

.thead {
	background: #16b0c2 url(images/pl/th_pl.png) repeat-x;
	color: #083e4c;
	border: 1px solid #55c3d0;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
        height: 32px;
text-shadow: black 0.0em 0.0em 0.0em;
}

.thead a:link {
	color: #083e4c;
	text-decoration: none;
text-shadow: black 0.0em 0.0em 0.0em;
	font-size: 17px;
}

.thead a:visited {
	color: #083e4c;
	text-decoration: none;
text-shadow: black 0.0em 0.0em 0.0em;
	font-size: 17px;
}

.thead a:hover, .thead a:active {
	color: #151515;
	text-decoration: underline;
text-shadow: black 0.0em 0.0em 0.0em;
	font-size: 17px;
}

.tcat {
	background: #2d2d2d;
	border: 1px solid #262626;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
	color: #f0f0f0;
        padding: 5px;
	font-size: 12px;
}

.tcat a:link {
	color: #fff;
}

.tcat a:visited {
	color: #fff;
}

.tcat a:hover, .tcat a:active {
	color: #fff;
}

.trow1 {
	background: #3d3d3d;
}

.trow2 {
	background: #3d3d3d;
}

.trow_shaded {
	background: #ffdde0;
}

.trow_selected td {
	background: #FFFBD9;
}

.trow_sep {
	background: #2d2d2d;
	border: 1px solid #262626;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
	color: #fff;
	font-size: 12px;
	font-weight: bold;
}

.tfoot {
	background: #2d2d2d;
	color: #ffffff;
	border: 1px solid #262626;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
}

.tfoot a:link {
	color: #ffffff;
	text-decoration: none;
}

.tfoot a:visited {
	color: #ffffff;
	text-decoration: none;
}

.tfoot a:hover, .tfoot a:active {
	color: #ffffff;
	text-decoration: underline;
}

.bottommenu {
	background: #3d3d3d;
	color: #000000;
	border: 1px solid #262626;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;	
        padding: 10px;
}

.navigation {
	background: #3d3d3d;
	color: #fff;
	border: 1px solid #262626;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;	
        padding: 10px;	
	font-weight: bold;
	font-size: 15px;
letter-spacing: 0px;
text-shadow: black 0.1em 0.1em 0.2em;
}

.navigation a:link {
	text-decoration: none;
}

.navigation a:visited {
	text-decoration: none;
	color: #fff;
	font-size: 15px;
        letter-spacing: 0px;
        text-shadow: black 0.1em 0.1em 0.2em;
	font-weight: bold;
}

.navigation a:hover, .navigation a:active {
	text-decoration: underline;
	color: #55c3d0;
	font-size: 15px;
        letter-spacing: 0px;
        text-shadow: black 0.1em 0.1em 0.2em;
	font-weight: bold;
}

.navigation .active {
	color: #fff;
	font-size: 15px;
        letter-spacing: 0px;
        text-shadow: black 0.1em 0.1em 0.2em;
	font-weight: bold;
}

.smalltext {
	font-size: 11px;
}

.largetext {
	font-size: 16px;
	font-weight: bold;
}

input.textbox {
	background: #ffffff;
	color: #000000;
	border: 1px solid #0f5c8e;
	padding: 1px;
}

textarea {
	background: #ffffff;
	color: #000000;
	border: 1px solid #0f5c8e;
	padding: 2px;
	font-family: Verdana, Arial, Sans-Serif;
	line-height: 1.4;
	font-size: 13px;
}

select {
	background: #ffffff;
	border: 1px solid #0f5c8e;
}

.editor {
	background: #f1f1f1;
	border: 1px solid #ccc;
}

.editor_control_bar {
	background: #fff;
	border: 1px solid #0f5c8e;
}

.autocomplete {
	background: #fff;
	border: 1px solid #000;
	color: black;
}

.autocomplete_selected {
	background: #adcee7;
	color: #000;
}

.popup_menu {
	background: #ccc;
	border: 1px solid #000;
}

.popup_menu .popup_item {
	background: #fff;
	color: #000;
}

.popup_menu .popup_item:hover {
	background: #C7DBEE;
	color: #000;
}

.trow_reputation_positive {
	background: #ccffcc;
}

.trow_reputation_negative {
	background: #ffcccc;
}

.reputation_positive {
	color: green;
}

.reputation_neutral {
	color: #444;
}

.reputation_negative {
	color: red;
}

.invalid_field {
	border: 1px solid #f30;
	color: #f30;
}

.valid_field {
	border: 1px solid #0c0;
}

.validation_error {
	background: url(images/pl/invalid.gif) no-repeat center left;
	color: #f30;
	margin: 5px 0;
	padding: 5px;
	font-weight: bold;
	font-size: 11px;
	padding-left: 22px;
}

.validation_success {
	background: url(images/pl/valid.gif) no-repeat center left;
	color: #00b200;
	margin: 5px 0;
	padding: 5px;
	font-weight: bold;
	font-size: 11px;
	padding-left: 22px;
}

.validation_loading {
	background: url(images/spinner.gif) no-repeat center left;
	color: #555;
	margin: 5px 0;
	padding: 5px;
	font-weight: bold;
	font-size: 11px;
	padding-left: 22px;
}

/* Additional CSS (Master) */
img {
	border: none;
}

.clear {
	clear: both;
}

.hidden {
	display: none;
	float: none;
	width: 1%;
}

.hiddenrow {
	display: none;
}

.selectall {
	background-color: #FFFBD9;
	font-weight: bold;
	text-align: center;
}

.float_left {
	float: left;
}

.float_right {
	float: right;
}

.menu ul {
	list-style: none;
	margin: 0;
}

.menu li {
	display: inline;
	padding-left: 5px;
}

.menu img {
	padding-right: 5px;
	vertical-align: top;
}

#panel .links {
	margin: 0;
	float: right;
}

.expcolimage {
	float: right;
	width: auto;
	vertical-align: middle;
	margin-top: 3px;
}

img.attachment {
	border: 1px solid #E9E5D7;
	padding: 2px;
}

hr {
	background-color: #303030;
	color: #303030;
	height: 1px;
	border: 0px;
}

#copyright {
	font: 11px Verdana, Arial, Sans-Serif;
	margin: 0;
	padding: 10px 0 0 0;
}

#debug {
	float: right;
	text-align: right;
	margin-top: 0;
}

blockquote {
        border: 1px solid #ccc;
        margin: 0;
        background: #fff;
        color: #000000;
        font-weight: bold;
        padding: 4px;}

blockquote cite {
	font-weight: bold;
	border-bottom: 1px solid #ccc;
	font-style: normal;
	display: block;
	margin: 4px 0;
}

blockquote cite span {
	float: right;
	font-weight: normal;
}

blockquote cite span.highlight {
	float: none;
	font-weight: bold;
	padding-bottom: 0;
}

.codeblock {
	background: #fff;
	border: 1px solid #ccc;
	padding: 4px;
	color: #000;
}

.codeblock .title {
	border-bottom: 1px solid #ccc;
	font-weight: bold;
	margin: 4px 0;
}

.codeblock code {
	overflow: auto;
	height: auto;
	max-height: 200px;
	display: block;
	font-family: Monaco, Consolas, Courier, monospace;
	font-size: 13px;
}

.subforumicon {
	border: 0;
	vertical-align: middle;
}

.separator {
	margin: 5px;
	padding: 0;
	height: 0px;
	font-size: 1px;
	list-style-type: none;
}

form {
	margin: 0;
	padding: 0;
}

.popup_menu .popup_item_container {
	margin: 1px;
	text-align: left;
}

.popup_menu .popup_item {
	display: block;
	padding: 3px;
	text-decoration: none;
	white-space: nowrap;
}

.popup_menu a.popup_item:hover {
	text-decoration: none;
}

.autocomplete {
	text-align: left;
}

.subject_new {
	font-weight: bold;
}

.highlight {
	background: #FFFFCC;
	padding-top: 3px;
	padding-bottom: 3px;
}

.pm_alert {
	background: #FFF6BF;
	border: 1px solid #FFD324;
	text-align: center;
	padding: 5px 20px;
	margin-bottom: 15px;
	font-size: 11px;
}

.pm_alert a:link {
        color: #083e4c;
}

.pm_alert a:visited {
        color: #083e4c;
}

.red_alert {
	background: #FBE3E4;
	border: 1px solid #A5161A;
	color: #A5161A;
	text-align: center;
	padding: 5px 20px;
	margin-bottom: 15px;
	font-size: 11px;
}

.high_warning {
	color: #CC0000;
}

.moderate_warning {
	color: #F3611B;
}

.low_warning {
	color: #AE5700;
}

div.error {
	padding: 5px 10px;
	border-top: 2px solid #FFD324;
	border-bottom: 2px solid #FFD324;
	background: #FFF6BF;
	font-size: 12px;
}

div.error a:link {
        color: #55c3d0;
	font-size: 12px;
}

div.error a:active {
        color: #55c3d0;
	font-size: 12px;
}

div.error p {
	margin: 0;
	color: #000;
	font-weight: normal;
}

div.error p em {
	font-style: normal;
	font-weight: bold;
	padding-left: 24px;
	display: block;
	color: #C00;
	background: url(images/pl/error.gif) no-repeat 0;
}

div.error.ul {
	margin-left: 24px;
}

.online {
	color: #15A018;
}

.offline {
	color: #C7C7C7;
}

.pagination {
	font-size: 11px;
	padding-top: 10px;
	margin-bottom: 5px;
}

.tfoot .pagination, .tcat .pagination {
	padding-top: 0;
}

.pagination .pages {
	font-weight: bold;
}

.pagination .pagination_current, .pagination a {
	padding: 2px 6px;
	margin-bottom: 3px;
}

.pagination a {
        background: #108ba7 url(images/pl/p_pl.png) repeat-x;
	border: 1px solid #55c3d0;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
}

.pagination .pagination_current {
	background: #108ba7;
	border: 1px solid #55c3d0;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
	font-weight: bold;
	color: #fff;
}

.pagination a:hover {
	background: #108ba7;
	text-decoration: none;
        color: #fff;
}

.thread_legend, .thread_legend dd {
	margin: 0;
	padding: 0;
}

.thread_legend dd {
	padding-bottom: 4px;
	margin-right: 15px;
}

.thread_legend img {
	margin-right: 4px;
	vertical-align: bottom;
}

.forum_legend, .forum_legend dt, .forum_legend dd {
	margin: 0;
	padding: 0;
}

.forum_legend dd {
	float: left;
	margin-right: 10px;
}

.forum_legend dt {
	margin-right: 10px;
	float: left;
}

.success_message {
	color: #00b200;
	font-weight: bold;
	font-size: 10px;
	margin-bottom: 10px;
}

.error_message {
	color: #C00;
	font-weight: bold;
	font-size: 10px;
	margin-bottom: 10px;
}

.post_body {
	padding: 5px;
        color: #FFFFFF;
}

.post_body a:link {
    color: #33CCFF;
    text-decoration: none;
}

.post_body a:visited {
    color: #33CCFF;
    text-decoration: none;
}

.post_body a:hover, .post_body a:active {
    color: #248FB2;
    text-decoration: underline;
}

.post_content {
	padding: 5px 10px;
        color: #16b0c2
}

.quick_jump {
	background: url(images/pl/jump.gif) no-repeat 0;
	width: 13px;
	height: 13px;
	padding-left: 13px; /* amount of padding needed for image to fully show */
	vertical-align: middle;
	border: none;
}

.repbox {
	font-size:16px;
	font-weight: bold;
	padding:5px 7px 5px 7px;
}

._neutral {
	background-color:#FAFAFA;
	color: #999999;
	border:1px solid #CCCCCC;
}

._minus {
	background-color: #FDD2D1;
	color: #CB0200;
	border:1px solid #980201;
}

._plus {
	background-color:#E8FCDC;
	color: #008800;
	border:1px solid #008800;
}

.pagination_breadcrumb {
	background-color: #f5f5f5;
	border: 1px solid #fff;
	outline: 1px solid #ccc;
	padding: 5px;
	margin-top: 5px;
	font-weight: normal;
}

.pagination_breadcrumb_link {
	vertical-align: middle;
	cursor: pointer;
}

.forumdesc {
    background: rgba(0, 0, 0, 0.5);
    padding: 4px;
    color: #fff;
}

.logo {
       width: 990px;
       height: 150px;
       text-align: left;
       margin-top: -15px;
}

.button {
        background: #108ba7 url(images/pl/p_pl.png) repeat-x;
	border: 0px solid #55c3d0;
        -moz-border-radius: 10px 10px 10px 10px;
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
        color: #fff;
}

.button:hover {
       background: #108ba7;
       color: #fff;
}

.logintext {
	width: 100;
	height: 79px;
}

.loginform {
	width: 100;
	height: 79px;
}

#header {
       width: 990px;
       height: 150px;

}
		

Thanks for the help
Remove text shadow from table in your global.css.

table {
     color: #ffffff;
     font-family: Verdana, Arial, Sans-Serif;
     font-size: 15px;
 letter-spacing: 0px;
 text-shadow: black 0.1em 0.1em 0.2em;
 }
(2011-08-03, 12:45 AM)Johnny S Wrote: [ -> ]Remove text shadow from table in your global.css.

Thank you so much; this was giving me a huge headache (both from looking at it and not being able to figure it out). Toungue

Rep added