css-selectors

Problem with a:active style and absolute positioning

OK, I added a universal style to my main.css that says: a:active { top:1px; position:relative; } This gives me a nice little "nudge" effect when anything is clicked. Consequently, I had to go around to all of my absolutely positioned <a> elements and fix them from jumping up to top:1px and manually give them the proper nudge. Alt...

Selector for pressed button

Is there any option, or special selector to change the style for a pressed button, what I mean by that..when a user clicks a button I want to change the style for that button? Is there any option to do that like: :focus or only with javascript click/focus event? ...

Jquery and the :active selector

This is my code: $('#ss a:active').parent().addClass('ss-active'); I guess you can tell from my code what I want to do, but it's not working, how can I do this? and I also want when the user removes the mouse from the button to come back to normal state, what I mean by: "the user removes the mouse from the button" is that the user can...

Jquery: How to process a div after you have appended or set data to it optimally

I think this question is better served with an example. I have the following code: $.get('path/'+id,function(data){ $('#mydiv').html(data); $('.editable').button().click(function(){ //process here }); }); And it works just...

What jQuery syntax would I use for finding the all of the first-generation UL tags within a parent tag (and all of its children)

Given the following HTML, how can I select all of the 1st-generation UL tags such that I end up with the following elements: company, subnav_1 - subnav_4, enginTool, prodSup, qualRel and lit, but none of the ULs inside of those elements? <div id="col1"> <h2></h2> <ul id="company"></ul> <div id="nav"> <div id="navcordion"> ...

Odd pages in CSS

How do I place a background image to the left in every odd page and to the right in every even page with CSS when printing? I have searched for quite some time to a solution about this. W3C mentions @page :left but also says that the context can only be used for margins. Looking through the W3C CSS3 instead of CSS2 I do see somethings ...

Why is the # selector of lesser specificity than anything?

Big bold caps-lock TL;DR: I KNOW HOW SELECTOR SPECIFICITY IS DETERMINED, I THINK IT USES FLAWED ASSUMPTIONS AND I CAN BACK MY IRRITATIONS UP WITH VALID SET THEORY RELATIONS, PLEASE DO NOT RESPOND EXPLAINING W3 CALCULATION RULES FOR SPECIFICITY, PLEASE READ THE QUESTION <- read that. This has bothered me for some time, when I write a st...

Preventing a table's headers from being sortable using JQuery Sortable plug-In

I have an HTML table: <table id="HatedByCSSOnlyGoons"> <tr><td>Header 1</td><td>Header 2</td></tr> <tr><td>Data</td><td>Data</td></tr> <tr><td>Data</td><td>Data</td></tr> </table> and I'm applying the JQuery Sortable plug-In: <script language="javascript"> $(document).ready( function() { $("#HatedByC...

css selector by class prefix

I want to apply a CSS rule to any element whose one of the classes matches specified prefix. E.g. I want a rule that will apply to div that has class that starts with status- (A and C, but not B in following snippet): <div id='A' class='foo-class status-important bar-class'></div> <div id='B' class='foo-class bar-class'></div> <div id=...

What jQuery selector can I use to match these HTML elements (requires ":contains()")?

I'm trying to find a jQuery selector that will match only the element that directly contains the text "PDT" in the following two examples (truncated for brevity): <div> <p> <strong>(07-27) 21:28 PDT SAN FRANCISCO</strong> -- San Francisco supervisors ended more than a decade... </p> <p>The 10-1 vote, with only Supervisor C...

How can I activate a CSS style for a label when hovering over the associated checkbox?

Every time I hover over the label of a checkbox it turns yellow: Markup <input type="checkbox" value="hello" id="hello" name="deletefiles[]"/> <label for="hello">hello</label> CSS label:hover, label:active { background:yellow; } When I hover over the related checkbox, I want the label to highlight. Is there a way to fire the sa...

Can't get nth node in Selenium

I try to write xpath expressions so that my tests won't be broken by small design changes. So instead of the expressions that Selenium IDE generates, I write my own. Here's an issue: //input[@name='question'][7] This expression doesn't work at all. Input nodes named 'question' are spread across the page. They're not siblings. I've t...

What does + mean in CSS?

What does the + in this CSS rule mean? h2 + p { font-size: 1.4em; font-weight: bold; color: #777; } ...

CSS how to target 2 attributes?

OK if I want to target an <input> tag with type="submit" I can do so like: input[type=submit] Also if I want to target an <input> tag with value="Delete" I can do so like: input[value=Delete] But How can I target an <input> tag with BOTH? ...

Should I avoid using !important in CSS?

Sometimes !important is useful, for example if I have defined common style for all links on the site (selector, say, a), but when I want to override some rules I have the following choices: Use more specific (longer) selector Use !important Which way is better and may be there are some guidelines? ...

I need Some CSS Ideas for Visualization for visitors

I am currently trying to improve the look of my website (beta) for book accommodations and hostels, the site is a basically a directory for hostels. Well, at front page, you will notice that all headings are almost sharing same color... However i am unhappy with that, i mean i want to colorize things a bit, but need some advices from c...

CSS Input Type Selectors - Possible to have an "or" or "not" syntax?

Hi Guys (and Gals, if they exist in programming), If i have a HTML form with the following inputs: <input type="text" /> <input type="password" /> <input type="checkbox" /> I want to apply a style to all input's that are either type="text" or type="password". Alternatively i would settle for all input's where type != "checkbox". Se...

jQuery CSS 'or' selector

Hello, I am trying to select elements of a (certain class || another class) with the same selector. How can I go about doing that? Currently, I have: $(".class1 .class2").each(function(idx, el) {... }); however, that only selects elements that match both classes, not one or the other. How can I select elements that match one or bot...

css multiple class / id selectors?

I'd like to know how to write a css block that applies to either multiple ids or multiple classes: Something like: .class1, .class2 { ... } or #id1, #id2 { ... } I'd like to know how to do both cases (which hopefully are cross browser compliant). Thanks. Update: To make it more interesting, is this valid too? #id tr, #id2 tr ...

Select every Nth element in CSS

Hi, Is it possible to select, say, every fourth element in a set of elements? Ex: I have 16 <div> elements... I could write something like. div:nth-child(4), div:nth-child(8), div:nth-child(12), div:nth-child(16) is there a better way to do this? ...