I know the basics of CSS but haven't found an answer to this.
Previously, I had :
li[data-sizex="1"] .widget.widget-jenkins-view-build-status
to apply a certain style to all the widgets of this kind under li tags with sizex set to 1.
But now I want to apply it to those with sizey set to 1 too, so I wrote :
li[data-sizex="1"] .widget.widget-jenkins-view-build-status, li[data-sizey="1"] .widget.widget-jenkins-view-build-status
It works, but here's my question : is there a way to regroup/shorten/factorize this, to avoid repetition of the widget, without adding new elements such as classes ? A pure factorization like in math : A with C or B with C <==> (A or B) with C .
Thank you.
Related
I've got an application where Set semantics would be useful for me, but I'm dealing with floating point numbers. I'd like to have a criterion for inclusion in the set that isn't exact equality - that is, if my Set already contains 0.5, I'd like it to ignore 0.50000000000000000018 if there's an attempt to add it. Is there existing machinery that allows this?
As long as you don't need to keep the precision up in the Set, you could use a Set{Float16} or Set{Float32}:
julia> set = Set{Float16}()
Set{Float16}()
julia> push!(set, Float16(2.3))
Set{Float16} with 1 element:
Float16(2.3)
julia> push!(set, Float16(2.300000001))
Set{Float16} with 1 element:
Float16(2.3)
Trying to validate our CSS files , when running tests the Jigsaw tool says some of our 0 values do not have units , but we cannot find what line of CSS they're referring to.
CSS URL : https://ik.imagekit.io/mqpttb8ig/cv-16-2-2021_eL_A9soPu.css
Can someone please let me know which 0 value is preventing validation here?
Regards,
Paul
There are quite a few 0 values in your file—across margin, padding, and outline properties—but they are fine, 0 values do not need units to be appended to them.
On another note, there are way too many important flags and magic numbers—I’d worry about them more.
My problem is a little complex to explain because I'm not a english native speaker and I don't know the word in this matter, but I will try to explain it.
If you think you have keyword to help me, don't hesitate, thanks.
So, I was explaining the binary tree concept to a beginner, and I gave him the formula "2^n - 1". So if the binary tree is full and have a depth of 3, there will be "2^3 - 1 = 7" element in the binary tree.
Then the beginner asked "what if there is not only 2 child (left and rigth) but 3 ? What the formula will be ?" (okay, if each element have 3 child, it's not a binary tree anymore, but bear with me, it's for the sake of the argument).
So a procede to found the formula but failed to do so.
I know that the solution is :
n
Ʃ 3^(x-1)
x = 1
but I can't found the "simplified" version, like
n
Ʃ 2^(x-1)
x = 1
give 2^n - 1
Did the formula exist ? Can we have a general formula with 'C' as the number of child the tree have ?
Sorry for my english, and thanks for reading.
The number of nodes C_{m,k} of a complete tree of height k with m-ary fanout is given by the formula
C_{m,k} = (m^(k+1) - 1) / (m-1);
Proof:
Observation: at level i there are precisely m^i nodes in the tree. 'Level' means distance to the root node (consequentially, the root node's level is 0). Therefore,
C_{m,k} = sum_{i=0..k} ( m^i )
The summation is a finite geometric progression ( ie. the quotient between consecutive summation elements is a constant ). The general formula is ...
C_{m,k} = (m^(k+1) - 1) / (m-1);
... which can easily be proven by induction
I'm doing a little experiment, trying to alternate background colours for nested divs.
This is what I intend to achieve (without the inline styles):
<div style="background: #fff;">
<div style="background: #000;">
<div style="background: #fff;">
<div style="background: #000;">
and so on...
</div>
</div>
</div>
</div>
I feel like I must be missing something obvious! I tried div:nth-of-type(2n) but this appears to only apply on one level.
This is for an experiment where the divs are generated, so the solution needs to be endless (not something along the lines of div div div div = white). I know it's quite easy with JavaScript, just looking for a pure CSS solution.
As Mr Lister pointed out, nth-of-type works on one level (that of the parent of the selected div).
As far as i know and after looking through the W3C CSS3 Selectors there doesn't appear to be any css selectors for traversing through nesting (except the > selector, which only looks at the direct child of parent).
I would love te be proven wrong though as that could be very usefull.
So the only (css) solution would be the one you already stated: div > div > div {background: white; }
Can't you just generate this along with the generation of the div's?
As stated by others, this is not possible in pure CSS. However using js it is quite possible and fairly easy too.
For ease I implemented this in jQuery but you could do with pure JS.
http://jsfiddle.net/sg3s/Suf3p/
I basically made a small jQuery plugin that colors the selector you apply it on with the primary color, and uses the subselect to get a matching child to color with the secondary color and so on until no children matching the subselect are left.
jQuery(function($) {
$.fn.alternateNestedBgColor = function(subselect, colors) {
// While not a great optimization, length of the colors array always stays the same
var l = colors.length;
// Itterate over all element in possible array
// jQuery best practice to handle initializing multiple elements at once
return this.each(function() {
var $sub = $(this), i = 0;
// Executes code, at least once
do {
// Set bg color for current $sub element
$sub.css('backgroundColor', colors[i++ % l]);
// Set $sub to direct children matching given selector
$sub = $sub.children(subselect);
// Will repeat the do section if the condition returns true
} while ($sub.length > 0);
});
};
// target first div in the body
// first argument = child selector
// second argument = array list of colors
$('body>div').alternateNestedBgColor('div', ['red', 'green', 'blue', 'purple', 'grey']);
});
Update As requested an update detailing how apply and modulo were used.
It's been almost 2 year since I recently posted this. And while working, the solution I made back then was a bit verbose and confusing, as for instance, I never needed apply. I got a little bit more comfortable with scopes, so I revised the function to be much simpler.
The only situation where apply is useful is when you need to pass a value to the this variable inside the function scope. Unless working with classes there aren't a whole lot of situations you should have a need for apply or call. If you want to read up on it I would like to refer you to this answer which explains it in context of classes. The MDN link is a good resource as well (for this and other javascript constructs/concepts).
As for modulo, this is basic math and this question explains the operation quite well. In short it will give you the full integer remainder after dividing a number by another. So 33 % 8 = 1 which you could write as 33-parseInt(33/8)*8 in js though that would be grossly inefficient. The result of the operation will always be 0 (when the number perfectly divides) to the 2nd argument minus 1 (so 7 in my example).
0 % 3 = 0 // technically doesn't exist (as you can't divide 0 with anything) but 0 for practicality in all programming languages afaik(?)
1 % 3 = 1
2 % 3 = 2
3 % 3 = 0
4 % 3 = 1
5 % 3 = 2
6 % 3 = 0 etc...
It's one of those operations which is inherently simple for your CPU, in fact without it being able to do this we wouldn't have computers.
In the javascript revision I've written the selection of the color from the given array as colors[i++ % l].
In writing this would be give me the remainder of i / l and use that integer as an index for the colors array which returns a color for use.
The ++ will add 1 only after returning the value of i for use in the modulo, this behaviour would be reversed if I had written ++i, but that wouldn't work for our purpose here.
For reference here is the MDN article on do...while.
I hope that cleared some things up! :)
I'm using hpricot to process some externally generated HTML.
What is the simplest way to find elements of one type (in my case: img) that do not have an ancestor of other types (in my case: p or div)?
I think the XPath expression //img[not ancestors::div and not ancestors::p] should do what I'm looking for. Unfortunately hpricot apparently does not support the ancestor axis. And as far as I know there no "no such ancestor" operator in CSS that I could use.
I solved my problem using set operations. I fetched all A nodes and subtracted those with B or C ancestor. These sets are easy to express and my problem is small enough that I don't get performance or resource problems with it.
(doc.search("img") - doc.search("p img") - doc.search("div img")).each do |node|
# process node
end