Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

css reference an id with a colon

Posted on 2006-07-07
4
Medium Priority
?
949 Views
Last Modified: 2012-06-27
I want to create a css rule specific to an id, but the id has a colon embeded. I can't do anything about
the colon. In the example below, aaa works as expected, but ccc:ddd is not affected by the css, the
table appears normally, not width 100%. I want the ccc:ddd to work like the aaa. How can I do this?

<html>
<head>
<style>
      table#aaa {width:100%}
      table#ccc:ddd {width:100%}
</style>
</head>
<body>
<table id="aaa" style="background-color:green;color:white"><tr><td>aaa</td></tr></table>
<br/>
<table id="bbb" style="background-color:green;color:white"><tr><td>bbb</td></tr></table>
<br/>
<table id="ccc:ddd" style="background-color:green;color:white"><tr><td>ccc:ddd</td></tr></table>
</body>
</html>
0
Comment
Question by:lfrohman
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
4 Comments
 
LVL 30

Accepted Solution

by:
GrandSchtroumpf earned 500 total points
ID: 17057694
Interesting question...  I did not find any information about this special case.
The W3C validator (http://jigsaw.w3.org/css-validator/) sees the selector as "table#ccc"

This is the workaround, but IE6 does not support it:
     table[id="ccc:ddd"] {width:100%}

For IE, you'll need to use another workaround... like adding a class.
0
 
LVL 14

Expert Comment

by:dfu23
ID: 17061510
why can't you do anything about the colon?
0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

As a result of several questions about how to use Bootstrap I thought it would be a good idea to write down the development aspect of creating a Bootstrapped website in as little time as possible. Part 1 of this article will only concentrate on g…
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…
Suggested Courses

610 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question