Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Oct 2006
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Can CSS Properties be defined for specific HTML elements?

    I have this CSS code to add drop shaddows to tables. Normally, applying it to the code, would be easy... just surround the tables with <div> tags that are defined in the CSS... like so,

    Code:
    <style type="text/css">
    <!--
    
    /*core drop shadow rules*/
    .wrap1, .wrap2, .wrap3 {
    	display:inline-table;
    	/* \*/display:block;/**/} 
    .wrap1 {
    	float:left;
    	background:url(images/shadows/v2/shadow.gif) right bottom no-repeat;}
    .wrap2 {background:url(images/shadows/v2/corner_bl.gif) left bottom no-repeat;}
    .wrap3 {
    	padding:0 8px 8px 0;
    	background:url(images/shadows/v2/corner_tr.gif) right top no-repeat;}
    .wrap3 img {
    	display:block;
    	border:1px solid #ccc;
    	border-color:#efefef #ccc #ccc #efefef;}
    -->
    </style>
    
    <div id="main">
    	<div class="wrap1">
    		<div class="wrap2">
    			<div class="wrap3">
    
    <table><tr><td>some table</td></tr></table>
    
    </div></div></div>
    </div>
    So, here's my problem... I have no control over the HTML from my "blackbox" application, only the CSS. So, I need to somehow define that these <div> tags need to be applied to all the tables on the page...

    So, something like this...

    Code:
    <style type="text/css">
    <!--
    
    /*core drop shadow rules*/
    
    table {.wrap1, .wrap2, .wrap3}
    
    .wrap1, .wrap2, .wrap3 {
    	display:inline-table;
    	/* \*/display:block;/**/} 
    .wrap1 {
    	float:left;
    	background:url(images/shadows/v2/shadow.gif) right bottom no-repeat;}
    .wrap2 {background:url(images/shadows/v2/corner_bl.gif) left bottom no-repeat;}
    .wrap3 {
    	padding:0 8px 8px 0;
    	background:url(images/shadows/v2/corner_tr.gif) right top no-repeat;}
    .wrap3 img {
    	display:block;
    	border:1px solid #ccc;
    	border-color:#efefef #ccc #ccc #efefef;}
    -->
    </style>
    
    <table bgcolor="#ffffff"><tr><td>some table</td></tr></table>
    Is that possible? or am I just smoking crack?

    Thanks,

    John

  • #2
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,302
    Thanks
    28
    Thanked 276 Times in 270 Posts
    You can’t write HTML with CSS.
    For every complex problem, there is an answer that is clear, simple, and wrong.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •