8. Conditionals

#1



Hello can someone help me with this?

THANK YOU SO MUCH :kiss:


ERROR MESSAGE:
expected div.ray:nth-child(1) to have its width style equal to 350px but got 811px


$total: 10; //Number of .ray divs in our html
$step: 360deg / $total; //Used to compute the hue based on color-wheel


.ray {
  height: 30px;
}

@for $i from 1 through $total {
  .ray:nth-child(#{$i}) {
    width: if ($i % 2 == 0, 300px, 350px);
    margin-left: if ($i % 2 == 0, 0px, 50px);
    background: adjust-hue(blue, $i * $step);
    
  }
}

#2

Yeah same problem here, guess it is some kind of bug, tried with another browser but still not working :S

#3

Finally Get A Code button work, I got this one passed with next code:

$total: 10; //Number of .ray divs in our html
$step: 360deg / $total; //Used to compute the hue based on color-wheel


.ray {
  height: 30px;
}

//Add your for-loop here:
@for $i from 1 through $total {
    .ray:nth-child(#{$i}){
        background: adjust-hue(blue, $i * $step);
    width: if($i % 2 == 0, 300px, 350px);
        margin-left: if($i % 2 == 0, 0px, 50px);
    }
}
#4

I've tried using different browsers and adding the code like you've posted but its still an error :cry:

#5

The code supplied in the lesson is incorrect - even after copy/pasting directly I still got an error. It turns out you have to remove the space between the 'if' and the open parentheses. It runs with the space removed.

#6

yeah, same error here...

#7

Yea! Thank you so much!!!

#8

So there should never be a space after an if statement in sass?

#9

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.