function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
HeatherTHeatherT 

Using CSS in S-Control for Contact Delete

I am working on an s-control that will intercept a contact before it is deleted and get the reason for delete.  I am using the following code to format the page using the Salesforce css:
 
<BODY class="contact">
 <DIV class=bPageTitle>  <DIV class="ptBody secondaryPalette">  <DIV class=content><IMG class=pageTitleIcon alt=contact rc="/s.gif">  <H1 class=pageType>Contact<SPAN class=titleSeparatingColon>:</SPAN></H1>  <H2 class=pageDescription>Delete Options</H2>  </DIV></DIV></DIV>
 
When the page renders I see the following for the contact icon:
 
 
Is something not referenced properly?  I am using the following style sheets:
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">  <link href="/dCSS/Theme2/default/common.css" type="text/css"  media="handheld,print,projection,screen,tty,tv" rel="stylesheet" >  <link href="/dCSS/Theme2/default/custom.css" type="text/css"  media="handheld,print,projection,screen,tty,tv" rel="stylesheet" >
Greg HGreg H
The class in your BODY tag is incorrect.
Code:
<body class="contactTab detailPage">

You need to use the full text "contactTab" instead of just "contact".
-greg
HeatherTHeatherT
It still did not work.  As soon as I changed it from "contact" to "contactTab" I lost all of the formatting (color and font).
Greg HGreg H
Make sure you are including the common and standard style sheets:
Code:
<!-- common styles --><link href="/sCSS/11.0/Theme2/common.css" type="text/css" media="handheld,print,projection,screen,tty,tv" rel="stylesheet"> 
<!-- standard styles --><link href="/sCSS/11.0/Theme2/dStandard.css" type="text/css" media="handheld,print,projection,screen,tty,tv" rel="stylesheet"> 

Let me know if this still doesn't work,
-greg
HeatherTHeatherT

Thanks for all of your help but it still did not work.  I am including the scontrol code below.

I am now seeing the correct colors and fonts, but I still get the "x" over the contact icon.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" <http://www.w3.org/TR/html4/loose.dtd"> 
<!-- common styles --><link href="/sCSS/11.0/Theme2/common.css" type="text/css" media="handheld,print,projection,screen,tty,tv" rel="stylesheet">
<!-- standard styles --><link href="/sCSS/11.0/Theme2/dStandard.css" type="text/css" media="handheld,print,projection,screen,tty,tv" rel="stylesheet">

<body class="contactTab detailPage">
<DIV class="bPageTitle">
<DIV class="ptBody secondaryPalette">
<DIV class="content">
<IMG class="pageTitleIcon" alt="contact "rc="/s.gif">
<H1 class="pageType">Contact<SPAN class="titleSeparatingColon">:</SPAN></H1> 
<H2 class="pageDescription">Delete Options</H2> 
</DIV>
</DIV>
</DIV>
</BODY>


 

Greg HGreg H
The X over the icon is due to the fact that you are viewing the code outside of Salesforce.com. The stylesheets basically dictate that the contact icon be displayed underneath a transparent pixel.  In your code the transparent pixel is the /s.gif image. Since the reference to this image is relative you need to be viewing the code from within Salesforce to have the reference found. If you view outside of Salesforce then you'll need to include the entire reference to the image or https://na1.salesforce.com/s.gif.
 
And you're missing the "s" in your image reference.  Should be written as src="/s.gif".
-greg


Message Edited by Greg H on 01-07-2008 09:14 AM
HeatherTHeatherT
Thanks!  Actually, once I added the "s" into "src" it worked.  Thank you so much for all of your help!