6 replies [Last post]
rudy386
rudy386's picture
Offline
newbie
glasgow KY
Last seen: 11 years 14 weeks ago
glasgow KY
Timezone: GMT-5
Joined: 2010-09-30
Posts: 5
Points: 7

i'm running a javascript on my website
however the text in the input field is white on a white background.
a great deal of the text on my site is white.
i'm sure there is a CSS conflict.

how can i add CSS to the javascript so that the text in the input filed is Black?

site URL is: www.barren-county.net

the script in question is the toolbar at the bottom.
more specifically the "Connect" app connecting user to Facebook, MySpace etc.

here's the Full header.html where the javascript is located.
it's the one marked cdn.wibiya.com/Toolbars

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN" 
          "http://www.w3.org/TR/MathML2/dtd/xhtml-math11-f.dtd" >
<html dir="{S_TEXTDIR}" xml:lang="{S_LANGCODE}">
<head>
{S_HEADER_TAGS}
<link rel="stylesheet" type="text/css" href="{THEME_PATH}/style/style.css" />
<!-- IF S_MAIN_MENU or S_ADMIN_CSSMENU -->
<link rel="stylesheet" type="text/css" href="{THEME_PATH}/style/cpgmm.css" />
<!-- ENDIF -->
{CSS_IE}
 
<script src="http://cdn.wibiya.com/Toolbars/dir_0585/Toolbar_585555/Loader_585555.js" type="text/javascript"></script>
 
</head>
<body>
<!-- IF S_ADMIN_CSSMENU -->
	{G_LEFTIMAGE}<img src="images/spacer.gif" style="height:18px; float:left;" alt="Admin Menu Spacer" />
	<div id="menu">{S_MAIN_MENU}</div><br />
<!-- ELSEIF S_ADMIN_MENU -->
<div id="adminmenu"></div>
<script type="text/javascript">/*<![CDATA[*/
{S_ADMIN_MENU}
cmDraw ('adminmenu', adminMenu, 'hbr', cmThemeOffice, 'ThemeOffice');
/*]]>*/</script>
<!-- ELSE -->
<table class="headtable" border="0" cellpadding="0" cellspacing="0">
<!-- IF PUBLIC_HEADER -->
<tr><td>
 
<table width="100%" border="0" cellpadding="0" cellspacing="0">
	<tr>
	<td colspan="2" class="header01">
	<!-- IF S_IS_USER -->
		&nbsp;&nbsp;{U_WELCOME}
	<!-- ELSE -->
		&nbsp;&nbsp;<a href="{U_MY_ACCOUNT}"><b>{S_MY_ACCOUNT}</b></a>
	<!-- ENDIF -->
	</td>
	<td class="header03"></td>
	<td rowspan="2" class="spacertop">
	<p style="padding-top:6px; margin:0;">{S_NOWTIME}&nbsp;&nbsp;</p></td>
	</tr>
	<tr>
		<td colspan="3" class="header01a"><map name="headerpic" id="headerpic">
<area shape="rect" alt="Home" coords="24,1,360,80" href="http://barren-county.net/index.php" />
<area shape="rect" alt="Connect" coords="24,90,130,125" href="http://barren-county.net/index.php?name=Buddys" />
<area shape="rect" alt="Chat" coords="190,90,275,125" href="http://barren-county.net/index.php?name=Chat" />
<area shape="rect" alt="Forums" coords="300,90,420,125" href="http://barren-county.net/index.php?name=ForumsPro" />
<area shape="rect" alt="Photos" coords="450,90,560,125" href="http://barren-county.net/index.php?name=coppermine" />
<area shape="rect" alt="News" coords="600,90,700,125" href="http://barren-county.net/index.php?name=Pro_News" />
</map>
 
<img border="0" src="http://barren-county.net/themes/Hardwired/images/header/header_01.jpg" alt="Header Pic" usemap="#headerpic" /></td>
	</tr>
	<tr>
		<td class="header02"><span>{G_LEFTIMAGE}</span></td>
		<td colspan="2" class="header_b_home">
 
	<!-- IF S_MAIN_MENU and not S_THEMECP -->
		<table border="0" cellpadding="0" cellspacing="0"><tr><td>
  		<div id="menu" style="float:left;">{S_MAIN_MENU}</div>
		</td></tr></table>
	<!-- ELSE -->
		<span class="headmenu1">
		<a href="{T_LINK1URL}">{T_LINK1}</a>&nbsp;&nbsp;
		<a href="{T_LINK2URL}">{T_LINK2}</a>&nbsp;&nbsp;
		<a href="{T_LINK3URL}">{T_LINK3}</a>&nbsp;&nbsp;
		<a href="{T_LINK4URL}">{T_LINK4}</a>
		<!-- IF T_LINK5URL -->
		&nbsp;&nbsp;<a href="{T_LINK5URL}">{T_LINK5}</a>
		<!-- ENDIF -->
		<!-- IF T_LINK6URL -->
		&nbsp;&nbsp;<a href="{T_LINK6URL}">{T_LINK6}</a>
		<!-- ENDIF -->
		<!-- IF T_LINK7URL -->
		&nbsp;&nbsp;<a href="{T_LINK7URL}">{T_LINK7}</a>
		<!-- ENDIF -->
		<!-- IF T_LINK8URL -->
		&nbsp;&nbsp;<a href="{T_LINK8URL}">{T_LINK8}</a>
		<!-- ENDIF -->
		<!-- IF T_LINK9URL -->
		&nbsp;&nbsp;<a href="{T_LINK9URL}">{T_LINK9}</a>
		<!-- ENDIF -->
		<!-- IF T_LINK10URL -->
		&nbsp;&nbsp;<a href="{T_LINK10URL}">{T_LINK10}</a>
		<!-- ENDIF -->
		</span>
	<!-- ENDIF -->
		</td>
		<td class="spacerbottom">{G_RIGHTIMAGE}</td>
	</tr>
	<tr>
		<td>
			<img src="images/spacer.gif" width="30" height="1" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="220" height="1" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="481" height="1" alt="" /></td>
		<td>
			<img src="images/spacer.gif" width="49" height="1" alt="" /></td>
	</tr>
</table>
 
<!-- ENDIF -->
</td></tr></table>
<!-- ENDIF -->
<table class="maintable" cellpadding="0" cellspacing="0"><tr>
<!-- IF S_LEFTBLOCKS -->
<td valign="top" class="blockleft" id="pe600" {B_L_VISIBLE}>
	<table width="172" cellpadding="0" cellspacing="0" border="0"><tr><td valign="top">
	<img src="{THEME_PATH}/images/block_left_top.bmp" alt="" />
	</td></tr></table>
<!-- BEGIN leftblock -->
	<table width="192" border="0" cellspacing="0" cellpadding="0"><tr><td class="blockleft_header">
	<img alt="{L_TOGGLE}" title="{L_TOGGLE}" id="pic{leftblock.S_BID}" src="{leftblock.S_IMAGE}.gif" onclick="blockswitch('{leftblock.S_BID}');" style="cursor:pointer; padding:2px 5px 0 20px; float:left;" />
	<span class="block-title"><b>{leftblock.S_TITLE}</b></span></td>
	</tr><tr><td><img src="{THEME_PATH}/images/block_left_shaddow.bmp" height="4" alt="" /></td>
	</tr><tr><td class="blockleft" id="pe{leftblock.S_BID}" {leftblock.S_VISIBLE}>
 
	<table width="100%" border="0" cellpadding="0" cellspacing="0"><tr><td>
	<table width="154" border="0" cellpadding="0" cellspacing="0" style="margin:auto;"><tr><td class="content">{leftblock.S_CONTENT}</td></tr></table>
	<br />
	</td></tr></table>
	</td></tr></table>
<!-- END leftblock -->
</td>
<!-- ENDIF -->
<td class="main">
<!-- IF IMPORTANT_MESSAGE -->
<div style="text-align:center; font-size:18px; color:#FFFFFF;">{IMPORTANT_MESSAGE}</div><br />
<!-- ENDIF -->
<!-- IF PAGE_TITLE -->
<div class="pagetitle">{PAGE_TITLE}</div>
<!-- ENDIF -->
<!-- BEGIN messageblock -->
<div class="opentable1">
  <div class="option" align="center">{messageblock.S_TITLE}</div><br />
  <div class="content" >{messageblock.S_CONTENT}</div><br /><div align="center">
  <!-- IF S_CAN_ADMIN -->
  [ {messageblock.S_OUTPUT} - {messageblock.S_REMAIN} - <a href="{messageblock.U_EDITMSG}">{messageblock.S_EDIT}</a> ]
  <!-- ELSE -->
  {messageblock.S_DATE}
  <!-- ENDIF -->
  </div>
</div><br/>
<!-- END messageblock -->
<table width="100%" class="opentable1" cellspacing="1" cellpadding="5"><tr><td align="center">{S_BANNER}</td></tr></table><br />
<!-- BEGIN centerblock -->
<div class="opentable1">
	<div style="text-align:center;" id="pic{centerblock.S_BID}" onclick="blockslide('{centerblock.S_BID}');" title="{L_TOGGLE}">
		<b>{centerblock.S_TITLE}</b>
	</div>
	<div class="option" id="pe{centerblock.S_BID}" {centerblock.S_VISIBLE}>
		{centerblock.S_CONTENT}
	</div>
</div><br />
<!-- END centerblock -->

and also the complete CSS style.css

font, td, p	{
	font-family: Verdana,Helvetica; 
	font-size: 10px
}
img {
	border: 0;
}
body {
	color: #FFFFFF;
	background: #687483;
	margin:0px;
	padding:0px; 
	font-family: Verdana,Helvetica; 
	font-size: 10px;
}
 
.title {
	background: none; 
	color: #000000; 
	font-size: 13px; 
	font-weight: bold; 
	font-family: Verdana, Helvetica; 
	text-decoration: none;
}
.content {
	background: none; 
	color: #FFFFFF;
	font-size: 10px; 
	font-family: Verdana, Helvetica;
}
.block-title {
	background: none; 
	color: #000000; 
	font-size: 11px; 
	font-family: Verdana, Helvetica;
}
.storytitle {
	background: none; 
	color: #FFFFFF; 
	font-size: 14px; 
	font-weight: bold; 
	font-family: Verdana, Helvetica; 
	text-decoration: none;
	padding:0px;
}
.storycat {
	background: none; 
	color: #000000; 
	font-size: 10px; 
	font-weight: bold; 
	font-family: Verdana, Helvetica; 
	text-decoration: none;
}
.boxtitle {
	background: none; 
	color: #000000; 
	font-size: 10px; 
	font-weight: bold; 
	font-family: Verdana, Helvetica; 
	text-decoration: none;
}
.boxcontent {
	background: none; 
	color: #000000; 
	font-size: 10px; 
	font-family: Verdana, Helvetica;
}
.headtable {
  width: 100%;
  border-width: 0;
  border-collapse: collapse;
  border-spacing: 0;
  padding: 0;
}
.maintable {
  width: 100%;
  border-width: 0;
  border-collapse: collapse;
  border-spacing: 0;
  padding: 0;
}
.main {
  width: 100%;
  vertical-align: top;
  padding-left: 5px;
  padding-right: 5px;
  background: url(../images/middle_background.bmp);
}
.pagetitle {
  color: #FFF;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  border-width: 0;
  height: 16px;
  padding: 2px;
}
.option {
	background: none; 
	color: #FFD540; 
	font-size: 11px; 
	font-weight: bold; 
	font-family: Verdana, Helvetica; 
	text-decoration: none;
}
.tiny	{
	background: none; 
	color: #000000; 
	font-size: 10px; 
	font-weight: normal; 
	font-family: Verdana, Helvetica; 
	text-decoration: none;
}
 
.helphead {
    background-color: #F9A739;
    color      : #713600;
    font-size  : 10px;
    width  : 244px;
    padding: 3px;
    vertical-align: middle;
}
.helpcontent {
    width  : 240px;
    background-color: #687483;
    border : 1px solid #F9A739;
    padding: 4px;
}
 
br {
    clear: left;
}
 
label.set,input.set {
    display: block;
    float: left;
}
radio.set {
    display: block;
    float: left;
    vertical-align: text-bottom;
}
label.set {
    text-align: left;
    width: 300px;
    padding-right: 10px;
    margin-bottom: 5px;
}
label.ulog,input.ulog {
    display: block;
    float: left;
/*    margin-bottom: 5px; ugly */
}
label.ulog {
    text-align: left;
    width: 125px;
    padding-right: 10px;
    margin-bottom: 5px;
}
 
/* OpenTable */
 
table.opentable1, table.opentable2 {
	background: #687483; 
	border:1px solid #000000; 
	width: 100%; 
  border-spacing: 0px;
  padding: 7px;
 
}
.opentable1, .opentable2 {
	background: #687483; 
	border:1px solid #000000; 
  border-spacing: 0px;
  padding: 7px;
}
 
.graphicmenu {
	background: #687483; 
	border:1px solid #000000; 
  border-spacing: 0px;
  padding: 7px;
  text-align: left;
}
 
/* header top background */
.headertop {
	background: url(../images/header_top.gif); 
	height: 12px;
}
 
/* spacer top/bottom background */
	.header01 {
	background: #687483 url(../images/header/header_01.gif) repeat-x; 
	width: 250px;
	height: 29px;
	}
	.header01a {
	background: #687483 url(../images/header/header_01.jpg) no-repeat; 
	width: 731px;
	height: 132px;
	}
	.header02 {
	background: #687483 url(../images/header/header_02.jpg); 
	width: 30px;
	height: 39px;
	}
	.header03 {
	background: #687483 url(../images/header/header_02.gif) repeat-x; 
	width: 481px;
	height: 29px;
	}
	.header_b_home {
	background: #687483 url(../images/header/header_b_home.jpg); 
	width: 701px;
	height: 39px;
	text-align: left;
	}
.spacertop {
	background: url(../images/header/header_top_continue.jpg);
	width: 100%;
	height: 161px;
	text-align: right;
	vertical-align: top;
}
.spacerbottom {
	background: url(../images/header/header_bot_continue.jpg);
	width: 100%;
	height: 39px;
}
 
/* middle top block */
.mtop_block {
	background: url(../images/middle_block_top.bmp); 
	height: 12px;
}
 
/* block left/right */
.blockleft {
	background: url(../images/block_left.bmp);
}
.blockright {
	background: url(../images/block_right.bmp);
}
.blockleft_header {
	background: url(../images/block_left_header.bmp); 
	height: 20px;
}
.blockright_header {
	background: url(../images/block_right_header.bmp); 
	height: 20px;
}
 
/* bottom line */
.bottomline {
	background: url(../images/bottomline.bmp); 
	height: 30px;
}
.newsindex,.newsarticle {
  width: 100%;
  border: 0px solid #000;
  border-spacing: 0;
  padding: 5px;
}
/* tables that hold newscat, newsempty newstopic in themes/x/template/news/index.html */
.newsindex {
  background: #687483;
}
/* table that holds the news stories in themes\x\template\news\article.html */
.newsarticle {
  background: #687483;
}
/* newsbar */
.newsbar_top {
	background: #4F5B6A url(../images/navbar.jpg) repeat-x; 
	height: 27px;
}
.newsbar_bottom {
	background: #4F5B6A; 
	height: 36px;
}
 
hr	{
	border: 0px solid #713600;
	border-top-width:1px;
	height:0px;
}
/* fieldset around each admin item in administration */
.adminitem {
  border: 0;
  padding: 0;
  width: 130px;
  display: table-cell;
  vertical-align: bottom;
  text-align: center;
}
/* The text box under admin icons */
.adminitem span {
  display: block;
  width: 120px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
  border: thin solid #000;
  background: #687483;
}
/* Table Style: includes border color around every module table (main border around forums, administration, downloads, etc..) */
.table1,.table2 {
  border: thin solid #000;
  border-spacing: 0;
  padding: 7px;
  background: #687483;
}
/* div called from function OpenTable2 */
.table2 {
  width: 50%;
  text-align: center;
}
fieldset{
    border: #000000;
    border-style: double;
    padding: 10px;
    margin-bottom: 10px;
}
 
legend{
    font-weight: bold;
}
 
/* General font families for common tags */
font,th,td,p {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
}
 
a:link,a:active,a:visited {
    color : #D8E8FF;
    text-decoration: none;
}
a:hover {
    color: #FFF;
    text-decoration: none;
}
 
.statlink {
        color: #FFFFFF;
         text-decoration: none;
         font-weight: bold}
 
a.statlink  {
        text-decoration: none;
        color: #FFFFFF;
}
.statlink a {
        text-decoration: none;
        color: #D8E8FF;
}
a:hover.statlink  {
        color: #FFF;
        text-decoration: none;
}
 
.statlink a:hover {
        color: #FFFFFF;
        text-decoration: none;
}
 
.navmenu {
        font-family: Verdana, Arial, Helvetica, sans-serif;
        color: #FFFFFF;
        font-size: 12px;
        font-weight: bold;
        background : #49525D ;
        border-style: none;
}
 
.navmenu img {
        margin-top: 1px;
        margin-right: 5px;
        margin-bottom: 1px;
        margin-left: 5px;
}
 
.navmenu a {
        position: relative;
        display: block;
        padding-top: 2px;
        padding-right: 5px;
        padding-bottom: 2px;
        padding-left: 5px;
        text-decoration: none;
        color: #FFFFFF;
}
 
.navmenu a:hover {
        background : #EFEFEF ;
        text-decoration: none;
        color:         #000000;
}
 
hr {
    height: 0px;
    border: solid #D1D7DC 0px;
    border-top-width: 1px;
}
 
/* This is the border line & background colour round the entire page */
.bodyline    { background-color: #687483; border: 1px #000000 solid; }
 
/* This is the outline round the main forum tables */
.forumline    { 
	background-color: #687483; 
	border: 1px #000000 solid;
}
 
 
/* Main table cell colours and backgrounds */
td.row1    { background-color: #58626F; border : 1px solid #000;}
td.row2    { background-color: #58626F; border : 1px solid #000;}
td.row3    { background-color: #687483; }
 
/*
  This is for the table cell above the topics, Post & Last posts on the index.php page
  By default this is the fading out gradiated silver background.
  However, you could replace this with a bitmap specific for each forum
*/
td.rowpic {
        background-color: #687483;
        background-image: url(../images/cellpic1.gif);
 
}
 
/* Header cells - the blue and silver gradient backgrounds */
th {
    color: #FFFFFF;
    font-size: 11px;
    font-weight : bold;
    background-color: #687483;
    height: 27px;
    background-image: url(../images/navbar.jpg);
}
 
td.cat,td.catHead,td.catSides,td.catleft,td.catright,td.catbottom,td.catBottom {
    background-image: url(../images/cellpic1.gif);
    background-color:#687483;
    border: #000000;
    border-style: solid;
    height: 27px;
}
 
 
/*
  Setting additional nice inner borders for the main table cells.
  The names indicate which sides the border will be on.
  Don't worry if you don't understand this, just ignore it :-)
*/
td.cat,td.catHead,td.catbottom,td.catBottom {
    height: 27px;
    border-width: 0px 0px 0px 0px;
}
th.thHead,th.thSides,th.thtop,th.thleft,th.thright,th.thbottom,th.thCornerL,th.thCornerR {
    font-weight: bold; border: #000000; border-style: solid; height: 27px; }
 
td.row3right,td.spaceRow {
    background-color: #687483; border: #000000; border-style: solid; }
 
th.thHead,td.catHead { font-size: 12px; border-width: 0px 0px 0px 0px; }
th.thSides,td.catSides,td.spaceRow     { border-width: 0px 0px 0px 0px; }
th.thright,td.catright,td.row3right     { border-width: 0px 0px 0px 0px; }
th.thleft,td.catleft      { border-width: 0px 0px 0px 0px; }
th.thbottom,td.catbottom,td.catBottom  { border-width: 0px 0px 0px 0px; }
th.thtop     { border-width: 0px 0px 0px 0px; }
th.thCornerL { border-width: 0px 0px 0px 0px; }
th.thCornerR { border-width: 0px 0px 0px 0px; }
 
 
/* The largest text used in the index page title and toptic title etc. */
.maintitle,h1,h2    {
            font-weight: bold; font-size: 14px; font-family: Verdana, Arial, Helvetica, sans-serif;
            text-decoration: none; line-height : 120%; color : #FFFFFF;
}
 
 
/* General text */
.gen { font-size : 12px; }
.genmed { font-size : 11px; }
.gensmall { font-size : 10px; }
.gen,.genmed,.gensmall { color : #FFFFFF; }
a.gen,a.genmed,a.gensmall { color: #FFFFFF; text-decoration: none; }
a.gen:hover,a.genmed:hover,a.gensmall:hover    { color: #FFF; text-decoration: none; }
 
 
/* The register, login, search etc links at the top of the page */
.mainmenu        { font-size : 11px; color : #FFFFFF }
a.mainmenu        { text-decoration: none; color : #D8E8FF;  }
a.mainmenu:hover{ text-decoration: none; color : #FFF; }
 
 
/* Forum category titles */
.cattitle        { font-weight: bold; font-size: 12px ; letter-spacing: 1px; color : #D8E8FF}
a.cattitle       { text-decoration: none; color: #D8E8FF; }
a.cattitle:hover { text-decoration: none; color: #FFF; }
 
 
/* Forum title: Text and link to the forums used in: index.php */
.forumlink        { font-weight: bold; font-size: 12px; color : #D8E8FF; }
a.forumlink     { text-decoration: none; color : #D8E8FF; }
a.forumlink:hover{ text-decoration: none; color : #FFF; }
 
 
/* Used for the navigation text, (Page 1,2,3 etc) and the navigation bar when in a forum */
.nav            { font-weight: bold; font-size: 11px; color : #D8E8FF;}
a.nav            { text-decoration: none; color : #D8E8FF; }
a.nav:hover        { text-decoration: none; color: #FFF;}
 
 
/* titles for the topics: could specify viewed link colour too */
.topictitle            { font-weight: bold; font-size: 11px; color : #D8E8FF; }
a.topictitle:link   { text-decoration: none; color : #D8E8FF; }
a.topictitle:visited { text-decoration: none; color : #DFEFFF; }
a.topictitle:hover    { text-decoration: none; color : #FFF; }
 
 
/* Name of poster in viewmsg.php and viewtopic.php and other places */
.name            { font-size : 11px; color : #D8E8FF;}
 
/* Location, number of posts, post date etc */
.postdetails        { font-size : 10px; color : #D8E8FF; }
 
 
/* The content of the posts (body of text) */
.postbody { font-size : 12px;}
a.postlink:link    { text-decoration: none; color : #D8E8FF }
a.postlink:visited { text-decoration: none; color : #DFEFFF; }
a.postlink:hover { text-decoration: none; color : #FFF}
 
/* When posting a [geshifilter-code] or<br />
<div class="bb-quote">Quote:<br />
<blockquote class="bb-quote-body"> this is the style for the code or quote box. */&#10;.bbhead, .bbchead, .bbphphead {&#10;	color:#FFF;&#10;	background-color: #4f5b6a;&#10;	font: bold 12px Verdana, Helvetica, sans-serif;&#10;	border-left: 1px solid #000;&#10;	border-right: 1px solid #000;&#10;	border-top: 1px solid #000;&#10;	display:inline;&#10;	padding: 0px 4px 0px 4px;&#10;	margin: 0px 20px 0px 20px;&#10;	position:relative;&#10;	text-align:left;&#10;}&#10;.code, .quote, .bbcontent, .bbccontent, .bbphpcontent {&#10;  color: #4f5b6a;&#10;  background: #FAFAFA;&#10;  border: 1px solid #000;&#10;  padding:4px;&#10;  overflow: auto;&#10;  max-height: 250px;&#10;  margin: 0px 20px 0px 20px;&#10;  font: normal 11px Verdana, Arial, Helvetica, sans-serif;&#10;}&#10;&#10;/* Copyright and bottom info */&#10;.copyright        { font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; color: #FFFFFF; letter-spacing: -1px;}&#10;a.copyright       { color: #D8E8FF; text-decoration: none;}&#10;a.copyright:hover { color: #FFF; text-decoration: none;}&#10;&#10;&#10;/* Form elements */&#10;input.button, input.post, textarea, textarea.post, select {&#10;    background-color : #818D9B;&#10;    color: #FFF;&#10;    font: normal 11px Verdana, Arial, Helvetica, sans-serif;&#10;    border-color : #5B5B5B;&#10;    border-top-color: #5B5B5B;&#10;    border-left-color: #5B5B5B;&#10;    border-right-color: #5B5B5B;&#10;    border-bottom-color: #5B5B5B;&#10;    border-top-width: 1px;&#10;    border-left-width: 1px;&#10;    border-right-width: 1px;&#10;    border-bottom-width: 1px;&#10;}&#10;input{&#10;    background-color : transparent;&#10;    color: #FFF;&#10;    font: normal 11px Verdana, Arial, Helvetica, sans-serif;&#10;    border-color : #5B5B5B;&#10;    border-top-color: #5B5B5B;&#10;    border-left-color: #5B5B5B;&#10;    border-right-color: #5B5B5B;&#10;    border-bottom-color: #5B5B5B;&#10;    border-top-width: 1px;&#10;    border-left-width: 1px;&#10;    border-right-width: 1px;&#10;    border-bottom-width: 1px;&#10;}&#10;input { text-indent : 2px; }&#10;&#10;/* The main submit button option */&#10;input.mainoption {&#10;    background-color : #818D9B;&#10;    font-weight : bold;&#10;}&#10;&#10;/* None-bold submit button */&#10;input.liteoption {&#10;    background-color : #818D9B;&#10;    font-weight : normal;&#10;}&#10;&#10;/* This is the line in the posting page which shows the rollover&#10;  help line. This is actually a text box, but if set to be the same&#10;  colour as the background no one will know ;)&#10;*/&#10;&#10;.helpline {&#10;	background-color: #818D9B; &#10;	color: #000000;&#10;	border-style: none; &#10;	width: 100%;&#10;}&#10;&#10;td.comment { &#10;	text-align: center;&#10;	height: 30px; &#10;	color: #FFFFFF;&#10;	vertical-align: middle; &#10;}&#10;.headmenu1, a.headmenu1,.headmenu1 a, a:link.headmenu1, .headmenu1 a:link, .headmenu1 a:visited, a:visited.headmenu1  {&#10;    color: #cccccc;&#10;    font: bold 12px Verdana, Helvetica, sans-serif;&#10;}&#10;a:hover.headmenu1,.headmenu1 a:hover {&#10;    color: #FFF;&#10;    text-decoration: none;&#10;    font: bold 12px Verdana, Helvetica, sans-serif;&#10;}&#10;form {&#10;  margin-bottom: 0px;&#10;  }&#10;/* Header Login Style */&#10;.headerlogin {&#10;  float: left;&#10;  text-indent: 2px;&#10;  color: #cccccc;&#10;  font: normal 10px Verdana, Arial, Helvetica, sans-serif;&#10;}&#10;/*COPPERMINE CLASSES*/&#10;.gallerycat{&#10;BORDER-RIGHT: #696969 2px solid; &#10;BORDER-BOTTOM: #696969 2px solid;&#10;BORDER-TOP: #000 1px solid; &#10;BORDER-LEFT: #000 1px solid;&#10;background: #687483;&#10;}&#10;.tableb{&#10;border:1px solid #707070;&#10;}&#10;.tableb_compact{&#10;background:#707070 url(../images/cellpic1.gif) repeat;&#10;color:#FFF;&#10;}&#10;.tablef{&#10;background:#707070;&#10;}&#10;.tableh1{&#10;background:#707070 url(../images/bottomline.bmp) repeat;&#10;color:#FFF;&#10;height:30px;&#10;}&#10;.tableh1_compact{&#10;background:#707070 url(../images/cellpic3.gif) repeat;&#10;color:#FFF;&#10;height:30px;&#10;}&#10;.tableh2{&#10;background:#707070 url(../images/cellpic3.gif) repeat;&#10;color:#FFF;&#10;height:30px;&#10;}&#10;.tableh2_compact{&#10;background:#707070 url(../images/cellpic3.gif) repeat;&#10;color:#FFF;&#10;height:30px;&#10;}&#10;/* Link color for main gallery breadcrumb */&#10;a:link.statlink, a:active.statlink, a:visited.statlink {&#10;color: #FFF;&#10;}&#10;/* pagination */&#10;.pagact {&#10;    font-size: 10px;&#10;    width: 50px;&#10;    height: 20px;&#10;    text-align: center;&#10;    background: transparent url(../images/pagact.gif) no-repeat scroll 0 1px;&#10;}&#10;.paginact, .pagneutral {width: 50px; text-align: center; }&#10;.paginact a, .pagneutral a {&#10;    display: block;&#10;    font-size: 10px;&#10;    width: 50px;&#10;    height: 20px;&#10;    padding-top: 5px;&#10;    background: transparent url(../images/paginact.gif) no-repeat;&#10;}&#10;.pagneutral a {&#10;    background: transparent url(../images/pagneutral.gif) no-repeat;&#10;}
[/geshifilter-code]

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 7 years 46 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Not sure why you want to add

Not sure why you want to add CSS to JavaScript. Is the script spitting out inline styles to style the element. In the first instance you want to try and tackle the styling from the main stylesheets.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

rudy386
rudy386's picture
Offline
newbie
glasgow KY
Last seen: 11 years 14 weeks ago
glasgow KY
Timezone: GMT-5
Joined: 2010-09-30
Posts: 5
Points: 7

follow up

there is obviously a CSS conflict and the text appears invisible.
how would i go about styling from the main stylesheets?

can you show me an example?

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 8 years 6 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

rudy386 wrote: how can i add

rudy386 wrote:

how can i add CSS to the javascript so that the text in the input filed is Black?

Which input field?

By the way, do you have a reason to be using this doctype or have you just copied it from somewhere?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN" 
          "http://www.w3.org/TR/MathML2/dtd/xhtml-math11-f.dtd" >

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

rudy386
rudy386's picture
Offline
newbie
glasgow KY
Last seen: 11 years 14 weeks ago
glasgow KY
Timezone: GMT-5
Joined: 2010-09-30
Posts: 5
Points: 7

the script in question is the

the script in question is the toolbar at the bottom.
more specifically the "Connect" app connecting users to Facebook, MySpace etc.

the doc type came with CMS software that was free to download.

for some reason the more ppl i talk to about this, tell me the text appears alright to them.

don't know whats causing the white text on my side.

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 8 years 6 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

rudy386 wrote: the script in

rudy386 wrote:

the script in question is the toolbar at the bottom.
more specifically the "Connect" app connecting users to Facebook, MySpace etc.

You said that in your first post. I asked about which 'input field' as I don't see any inputs in the toolbar at the bottom.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

rudy386
rudy386's picture
Offline
newbie
glasgow KY
Last seen: 11 years 14 weeks ago
glasgow KY
Timezone: GMT-5
Joined: 2010-09-30
Posts: 5
Points: 7

input field

sorry,

click the "Connect" button on the toolbar,
and try and connect with Facebook, or Twitter etc.
once connected you should be prompted to update your status.
the field there is white text on a white background
(or at least it is on all of my computers)

i have reports that this is not the case,
be sure not to use the join chat app,as this is working.

thnx for your help