[SOLVED] CSS - How can I get it to stay unique to a single div layer?

jdlev · #1 (**permalink**) 11-20-08, 01:07 PM

Sorry to the mods, I posted the original question in the wrong forum.

Anyways...On a single web page, I have multiple layers so that I can layout the website how I want. The problem is that I want the h1 tags in one div layer to appear one way and the h1 tags in a separate div layer in a different way. How would I code the page so that I can have 2 separate css pages controling 2 different div layers on my page?

If you could provide me with an example, I would really appreciate it!

Thanks!

Nico · #2 (**permalink**) 11-20-08, 01:11 PM

Please do not cross-post. PM a mod next time, and he'll move your thread.

And you can do it this way:

HTML Code:

<div id="div1"><h1>Text</h1></div>

<div id="div2"><h1>Text</h1></di>

css Code:

#div1 h1
{
    /* Properties */
}
 
#div2 h1
{
    /* Properties */
}

jdlev · #3 (**permalink**) 11-20-08, 01:12 PM

PHP Code:


			
<html>

<head>

<title>Answering Services - provided by Telephone Answering Service.com</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script language="JavaScript" type="text/JavaScript">

<!--

function MM_reloadPage(init) {  //reloads the window if Nav4 resized

  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {

    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}

  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();

}

MM_reloadPage(true);

//-->

</script>

<style type="text/css">

<!--





-->

</style>

<link href="/styles/Footer.css" rel="stylesheet" type="text/css">

<link href="/styles/HTMLtags.css" rel="stylesheet" type="text/css">

<link href="/styles/TASsolutions.css" rel="stylesheet" type="text/css">

</head>

<body bgcolor="D1E3ED" link="#003399" LEFTMARGIN="0" TOPMARGIN="0" RIGHTMARGIN="0" BOTTOMMARGIN="0">

<div id="Footer" class="Footer" style="position:absolute; left:249px; top:545px; width:513px; height:73px; z-index:1">

  <div align="center"><span class="Footer"><a href="/Answering-Service/">Answering 

    Service</a> | <a href="/high-volume-call-center/">High Volume Call Center</a> 

    | <a href="/medical-answering-service/">Medical Answering Service</a> | <a href="/call-center/">Call 

    Center</a> | <a href="/call-center-services/">Call Center Services</a> | <a href="/Professionals-Answering-Service/">Professionals 

    Answering Service</a> | <a href="/Answering-Service-Business-Applications/">Answering 

    Service Business Applications</a> | <a href="/call-center-case-studies/">Call 

    Center Case Studies</a> | <a href="http://www.telephoneansweringservice.com">TelephoneAnsweringService.com</a> 

    </span> </div>

</div>

    

<div id="tasBodyTop" style="position:absolute; left:267px; top:174px; width:609px; height:187px; z-index:2">

  <h3 align="center"> &quot;Answering the call for excellence 

    among telephone answering services and call centers.&quot;</h3>

  <p align="left"> Searching for an answering service or call 

    center to man the phones 24 hours a day? Look no further than Telephone Answering 

    Service. TAS provides inbound call center support for a multitude of business 

    fields and varying business sizes. Trust the medical answering specialists 

    of Telephone Answering Service that have provided high-quality, reliable call 

    center patient support to medical practices that have been with Telephone 

    Answering Service for over 10 years! Bolster sales by having customers speak 

    with a live operator that can immediately dispatch on call support or complete 

    an online sale. Join other Fortune 500 companies that rely on the communications 

    infrastructure of Telephone Answering Service to handle mission critical projects. 

    Whatever your company, whatever your size, no matter your solution, Telephone 

    Answering Service has the call center expertise to effectively and professionally 

    handle your customer communication requirements. </p>

  <h2 align="center"> Select Your Call Center or Answering Service 

    Solution </h2>

</div>

<div style="position:absolute; left:265px; top:368px; width:611px; height:163px; z-index:3" class="TASsolutions">

  <table width="604" height="143" border="1" cellpadding="1" cellspacing="" align="center">

    <!--DWLayoutTable-->

    <tr> 

      <td width="149" height="139" valign="top">

<div align="left"> 

          <h1><img src="/Images/Answering_Service.jpg" width="149" height="53"><br>

            <a href="/answering-services/">Answering Service</a></h1>

          <p>Learn about the benefits of partnering with an answering service 

            like telephone answering service.com!<br>

          </p>

        </div></td>

      <td width="149" valign="top"><h1><img src="/Images/High_Volume_Call_center.jpg" width="149" height="54"><br>

          <a href="/call-center-high-volume/">High Volume Call Center</a></h1>

        <p>High volume call centers have special needs. TAS can handle high call 

          or overflow volume from large businesses.</p></td>

      <td width="149" valign="top"><h1><img src="/Images/medical_answering_service.jpg" width="149" height="53"><br>

          <a href="/medical-answering-service/">Medical Answering Service</a></h1>

        </td>

      <td width="149" valign="top"><h1><img src="/Images/business_answering_service.jpg" width="149" height="53"><br>

          <a href="/business-answering-service/">Business Answering Service</a></h1></td>

    </tr>

  </table>

</div>

<div align="center"> <img src="/Images/Template.jpg" width="790" height="597" border="0" usemap="#Map2">

  <map name="Map2">

    <area shape="rect" coords="426,132,490,154" href="/Answering_Services/">

    <area shape="rect" coords="503,133,571,154" href="/Business_Information/about_TAS.html">

    <area shape="rect" coords="583,131,643,154" href="/Business_Information/contact.html">

  </map>

  <map name="Map">

    <area shape="rect" coords="425,131,489,154" href="/answering_service/" target="_blank" alt="answering_services">

  </map>

</div>

</body>

</html>

jdlev · #4 (**permalink**) 11-20-08, 01:15 PM

Quote:

Originally Posted by Nico

Please do not cross-post. PM a mod next time, and he'll move your thread.

And you can do it this way:

HTML Code:

<div id="div1"><h1>Text</h1></div>

<div id="div2"><h1>Text</h1></di>

css Code:

#div1 h1
{
    /* Properties */
}
 
#div2 h1
{
    /* Properties */
}

Sorry about cross posting, and thanks for the help so far. The css is actually stored on different pages, and pulled in with link href statement. I do this to try to minimize cluttering the page. How would I do that in your example?