CODEWITHSUNDEEP
css
Egidi
Egidi

Reputation: 1776

css style for multiple html id tags

I have several similar html ids, example:

<il id="DashboardPoolAvailable_1"></il>
<il id="DashboardPoolAvailable_2"></il>
<il id="DashboardPoolAvailable_3"></il>
<il id="DashboardPoolAvailable_4"></il>
....

I need to build a unique CSS code that will work for all the DashboardPoolAvailable_* ids. Something like:

#DashboardPoolAvailable_* { display: inline-block; width: 924px; margin: 0px 13px; }

Upvotes: 0

Views: 49

Answers (4)

Joel
Joel

Reputation: 1321

If a style is used for more than one element it should really be a class not an id.

consider re-factoring to this:

<div class="DashboardPoolAvailable" id="dash1"></div>
<div class="DashboardPoolAvailable" id="dash2"></div>
<div class="DashboardPoolAvailable" id="dash3"></div>


.DashboardPoolAvailable {
  //all shared properties
}

#dash1{ //unique styles}
#dash2{ //unique styles}
#dash3{ //unique styles}

Upvotes: 1

ZEE
ZEE

Reputation: 5849

Use E[id^=DashboardPoolAvailable_] to match your id's

Element E whose attribute id starts with the value DashboardPoolAvailable_.

Upvotes: 0

Brian Glaz
Brian Glaz

Reputation: 15666

[id^="DashboardPoolAvailable_"]
{
    //styles
}

A better way would be to put all the li's into a UL with a class, and then use something like:

.ul-class li
{
    //styles
}

Upvotes: 2

A.B
A.B

Reputation: 20445

You can use this starts attribute selector . see guide 

li[id^='DashboardPoolAvailable_']{
display: inline-block; width: 924px; margin: 0px 13px;
}

Upvotes: 0

Related Questions