how do I edit my syle sheet to fix these large fonts? [Theme stylesheets (CSS) help]

how do I edit my syle sheet to fix these large fonts?

2007/2/6 20:36
rpilney
Just popping in
Posts: 76
Since: 2006/1/25

I have tried replacing the font number size with keywords as I read in another post but my fonts all went large on me.

here is my style sheet. PLEASE PLEASE HELP!

I have been working on this for almost 2 weeks off and on to fix it.

Quote:

body {color: #808080; background: black url('pc_bg.gif'); margin:0; padding:0; }
html { scrollbar-face-color: #10314A; scrollbar-highlight-color: #226C9B; scrollbar-shadow-color: #081621; scrollbar-3dlight-color: #000000; scrollbar-arrow-color: #226C9B; scrollbar-track-color: #000000; scrollbar-darkshadow-color: #000000;}



table {width: 900; margin: 0; padding: 0; font-size: small}
table td {padding: 0; border-width: 0; vertical-align: top; font-family: Tahoma, Verdana, sans-serif;}

a {color: #c0c0c0; text-decoration: none; font-weight: bold; background-color: transparent;}
a:hover {color: #ffffff;}

fieldset {border-color: #10314A;}

h1 {}
h2 {}
h3 {}
h4 {}
h5 {}
ul { margin: 2px; padding: 2px; list-style: decimal inside; text-align: left;}
li { margin-left: 2px; list-style: square inside; color: #2F5376}

.item {}
.itemHead {height: 18px; padding: 3px; background-color: #000000; background-image: url('centertop.jpg'); color: #FFFFFF}
.itemInfo {text-align: right; padding: 3px; background-color: #53514E}
.itemTitle a {font-size: 10px; font-weight: bold; font-variant: small-caps; color: #ffffff; background-color: transparent;}
.itemPoster {font-size: 90%; font-style:italic;
font-family: Tahoma, Verdana, sans-serif;
color: #c0c0c0;}
.itemPostDate {font-size: 90%; font-style:italic;
font-family: Tahoma, Verdana, sans-serif;
color: #c0c0c0;}
.itemStats {font-size: 90%; font-style:italic;}
.itemBody {padding-left: 5px;
font-family: Tahoma, Verdana, sans-serif;
font-size: 10px;}
.itemText {margin-top: 5px; margin-bottom: 5px; line-height: 1.5em;
font-family: Tahoma, Verdana, sans-serif;
font-size: 10px;}
.itemText:first-letter {font-size: 133%; font-weight: bold;}
.itemFoot {text-align: right; padding: 3px; background-color: #53514E}
.itemAdminLink {font-size: 90%;}
.itemPermaLink {font-size: 90%; font-style:italic;}

th {background-color: #2F5376; color: #FFFFFF; padding : 2px; vertical-align : middle; font-family: Verdana, Arial, Helvetica, sans-serif;}

td#headerbanner {width: 100%; background-color: #2F5376; vertical-align: middle; text-align:center;}
td#headerbar {border-bottom: 1px solid #dddddd; background-image: url('hbar.gif');}



td#leftcolumn {width: 180px; font-size:10px;}
td#leftcolumn th {background-color: #2F5376; color: #FFFFFF; vertical-align: middle;}
td#leftcolumn div.blockTitle {padding: 3px; background-color: transparent; color: #639ACE; font-weight: bold;
font-size: 12px;}
td#leftcolumn div.blockContent {padding: 3px; line-height: 120%; line-height: 120%;
font-size: 10px;}

td#centercolumn {font-size: 12px;}

td#centercolumn th {background-color: #2F5376; color: #FFFFFF; vertical-align: middle;}
td#centerCcolumn {padding: 0px 3px 1px 3px;}
td#centerCcolumn legend.blockTitle {padding: 3px; color: #639ACE; font-weight: bold; font-size: 12px; margin-top: 0px; margin-right: 0px; margin-left: 0px;}
td#centerCcolumn div.blockContent {padding: 3px; margin-right: 0px; margin-left: 0px; margin-bottom: 2px; line-height: 120%; font-size: 10px;}

td#centerLcolumn {width: 50%; padding: 0px 3px 0px 0px;}
td#centerLcolumn legend.blockTitle {padding: 3px; color: #639ACE; font-weight: bold; margin-top: 0px;}
td#centerLcolumn div.blockContent {padding: 3px; margin-left: 3px; margin-right: 2px; margin-bottom: 2px; line-height: 120%; font-size: 10px;}

td#centerRcolumn {width: 50%; padding: 0px 3px 0px 0px;}
td#centerRcolumn legend.blockTitle {padding: 3px; color: #639ACE; font-weight: bold; font-size: 12px; margin-top: 0px;}
td#centerRcolumn div.blockContent {padding: 3px; margin-left: 2px; margin-right: 3px; margin-bottom: 2px; line-height: 120%; font-size: 10px;}

div#content {text-align: left; padding: 8px;}

td#rightcolumn {width: 180px; font-size:12px;}
td#rightcolumn th {background-color: #2F5376; color: #FFFFFF; vertical-align: middle;}
td#rightcolumn div.blockTitle {padding: 3px; background-color: transparent; color: #639ACE; font-weight: bold; font-size: 12px;}
td#rightcolumn div.blockContent {padding: 3px; line-height: 120%;
font-size: 10px;
font-family: Tahoma, Verdana, sans-serif;}

tr#footerbar {text-align:center;
font-family: Tahoma, Verdana, sans-serif;
font-size: 10px;
color: #c0c0c0;}

td#mainmenu a {background-color: #000000; display: block; margin: 0; padding: 4px;}
td#mainmenu a:hover {background-color: #000000;}
td#mainmenu a.menuTop {padding-left: 3px;}
td#mainmenu a.menuMain {padding-left: 3px;}
td#mainmenu a.menuSub {padding-left: 3px; border-right: 2px solid #000000; border-bottom: 2px solid #000000; border-left: 2px solid #10314A;}
td#usermenu a {background-color: #000000; display: block; margin: 0; padding: 4px;}
td#usermenu a:hover {background-color: #000000;}
td#usermenu a.menuTop {border-top: 1px solid silver;}
td#usermenu a.highlight {background-color: #fcc;}

.outer {}
.head {background-color: #000000; padding: 5px; font-weight: bold;}
.even {background-color: #0A212F; padding: 5px;}
.odd {background-color: #10314A; padding: 5px;}
.foot {background-color: #000000; padding: 5px; font-weight: bold;}
tr.even td {background-color: #0A212F; padding: 5px;}
tr.odd td {background-color: #10314A; padding: 5px;}

div.errorMsg { background-color: #FFCCCC; text-align: center; border-top: 1px solid #DDDDFF; border-left: 1px solid #DDDDFF; border-right: 1px solid #AAAAAA; border-bottom: 1px solid #AAAAAA; font-weight: bold; padding: 10px;}
div.confirmMsg { background-color: #DDFFDF; color: #136C99; text-align: center; border-top: 1px solid #DDDDFF; border-left: 1px solid #DDDDFF; border-right: 1px solid #AAAAAA; border-bottom: 1px solid #AAAAAA; font-weight: bold; padding: 10px;}
div.resultMsg { background-color : #CCCCCC; color: #333333; text-align: center; border-top: 1px solid silver; border-left: 1px solid silver; font-weight: bold; border-right: 1px solid #666666; border-bottom: 1px solid #666666; padding: 10px;}

div.xoopsCode { background: #FFFFFF; border: 1px inset #000080; font-family: "Courier New",Courier,monospace; padding: 0px 6px 6px 6px;}
div.xoopsQuote { background: #000000; border: 1px inset #000080; font-family: "Courier New",Courier,monospace; padding: 0px 6px 6px 6px;}

.comTitle {font-weight: bold; margin-bottom: 2px;}
.comText {padding: 2px;}
.comUserStat {font-size: 10px; color: #2F5376; font-weight:bold; border: 1px solid silver; background-color: #ffffff; margin: 2px; padding: 2px;}
.comUserStatCaption {font-weight: normal;}
.comUserStatus {margin-left: 2px; margin-top: 10px; color: #ff0000; font-weight:bold; font-size: 10px;}
.comUserRank {margin: 2px;}
.comUserRankText {font-size: 10px;font-weight:bold;}
.comUserRankImg {border: 0px none;}
.comUserName {}
.comUserImg {margin: 2px;}
.comDate {font-weight: normal; font-style: italic; font-size: smaller}
.comDateCaption {font-weight: bold; font-style: normal;}

Re: how do I edit my syle sheet to fix these large fonts?

2007/2/6 22:06
preachur
Just can't stay away
Posts: 525
Since: 2006/2/4 4

Many of your font sizes are set to percents. Try changing them to px. Also, add this at the bottom of your body section:

font-size: 12px;

i.e.-

body {color: #808080; background: black url('pc_bg.gif'); margin:0; padding:0; font-size: 12px; }

Magick can never be restrained, but when freely given is thrice regained!

Re: how do I edit my syle sheet to fix these large fonts?

2007/2/6 22:13
rpilney
Just popping in
Posts: 76
Since: 2006/1/25

thanks preachur. Can you explain a little more on how to change a percent statment to px? ie 120% would be...

Thanks! You rock!

Quote:

preachur wrote:
Many of your font sizes are set to percents. Try changing them to px. Also, add this at the bottom of your body section:

font-size: 12px;

i.e.-

body {color: #808080; background: black url('pc_bg.gif'); margin:0; padding:0; font-size: 12px; }

Re: how do I edit my syle sheet to fix these large fonts?

2007/2/6 22:22
preachur
Just can't stay away
Posts: 525
Since: 2006/2/4 4

With a 12 px body base you would want 16 or 18 px

(I am not great with math, but I think that would make your site look right.)

Magick can never be restrained, but when freely given is thrice regained!

Re: how do I edit my syle sheet to fix these large fonts?

2007/2/6 22:24
rpilney
Just popping in
Posts: 76
Since: 2006/1/25

ok I follow you. sounded that simple but I wanted to make sure I was on the right track.

Quote:

preachur wrote:
With a 12 px body base you would want 16 or 18 px

(I am not great with math, but I think that would make your site look right.)

Stats
Goal:	$100.00
Due Date:	May 31
Gross Amount:	$0.00
Net Balance:	$0.00
Left to go:	$100.00

how do I edit my syle sheet to fix these large fonts?

Re: how do I edit my syle sheet to fix these large fonts?

Re: how do I edit my syle sheet to fix these large fonts?

Re: how do I edit my syle sheet to fix these large fonts?

Re: how do I edit my syle sheet to fix these large fonts?

Login

Search

Recent Posts

Re: Rebuilding and Updating a 20 years old Xoops Website from 2.0.18? to 2.5.11

Rebuilding and Updating a 20 years old Xoops Website from 2.0.18? to 2.5.11

Re: NewBB v 5.1.0 b 6

Re: NewBB v 5.1.0 b 6

NewBB v 5.1.0 b 6

Re: XOOPS 2.5.11 search user is not working

Re: oledrion

Re: oledrion

Re: oledrion

Re: oledrion

Who's Online

Donat-O-Meter

Latest GitHub Commits

{{ record.sha.slice(0, 7) }} - {{ record.commit.message | truncate }}