1

I am using AjaxControlToolkit CalendarExtender. Some previous rule in my stylesheet is affecting div's within the calendar.

div#paymentRegion div
{
    float:left;
    width:49%;
}

There are DIVs within the calendar that are being forced to 49%. How can I have the calendar ignore the previous settings and use the styles that come with the calendar? Is that possible? I am afraid to change the current rule, but I think it probably needs to be, however many other divs on this control rely on it. What does the > symbol do to a css rule. For example

div#paymentRegion > div
{
    float:left;
    width:49%;
}

Maybe that will help? I am open for any suggestions. Thanks, ~ck in San Diego

3 Answers 3

2

Theoretically, the > symbol would select only divs that are immediate children of #paymentRegion. A div nested farther down would be unaffected. However, not all browsers interpret that correctly, so it's not something you can reliably use.

A more direct solution is to wrap your calendar in a <div id="calendar"> and then write an overriding rule:

div#paymentRegion div {
    float: left;
    width: 49%;
}

div#calendar div {
    float: none;
    width: auto;
}

Now even though most divs inside #paymentRegion will be floated, the divs inside #calendar won't be!

1

VoteyDisciple is right, since his proposed solution's rule has a higher specificity than your current one.

More information on calculating specificity rules.

0

It's difficult to know what to suggest without any HTML. Can you tell us the basic structure? For example, is the div that is targeted in the first rule a direct child of #paymentRegion?

If it is the highest level div (not necessarily a direct child), and all other divs are below that one, you can try this:

div#paymentRegion div {
    float: left;
    width: 49%;
}

div#paymentRegion div div {
    float: none;
    width: auto;
}

However, the best bet would be to set a class/ID on that mysery div, if you can change your HTML.

div#paymentRegion div#uniqueID {
    float: left;
    width: 49%;
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.