html - Apply multiple CSS rules with one selector -


if example, have lot of css styles have apply objects within div #container. possible instead of write #container in front of all, have type of selector? don't have write every object within div #container?

html

<div id="container">     <div class="letter">a</div>     <div class="letter">b</div>     <div class="number">1</div>     <div class="number">2</div> </div> <div class="letter">c</div> <div class="number">3</div>

css

.letter {     font-size:25px;     color:green; } .number {     font-size:30px;     color:red; }

i want write rule every .letter , .number within #container.

ofcourse i'm reproducing issue here, there possibility change rules of .letter , .number applies #container without having change 2 times (2 times in reproduction)? (in issue it's 30 objects).

tried #container selector before rules, without succes. breaks styles.

my css attempt:

#container {     .letter {         font-size:25px;         color:green;     }     .number {         font-size:30px;         color:red;     } }

does know solution or have manually apply #container in front of every rule (which want avoid cause it's lot of work!):

#container .letter {     font-size:25px;     color:green; }  #container .number {     font-size:30px;     color:red; }

yes, css quite stupid , simple, have no other choose having #container in front of each class.

but

developers lazy , created pre-processing language add crazy functionality. currently, 2 alternatives : sass , less

but using technology can write styles :

nav {   ul {     margin: 0;     padding: 0;     list-style: none;   }    li { display: inline-block; }    {     display: block;     padding: 6px 12px;     text-decoration: none;   } }

and automatically generate css file :

nav ul {   margin: 0;   padding: 0;   list-style: none; }  nav li {   display: inline-block; }  nav {   display: block;   padding: 6px 12px;   text-decoration: none; }

this called "nesting" , 1 of many stuff love.

which 1 use between sass , less ?

they similar, recommandation existing framework , 1 available. exemple bootstrap use less , foundation use sass ... both quite similar.

i use both daily, , have preference sass, own opinion.


Comments

Post a Comment

Popular posts from this blog

php - failed to open stream: HTTP request failed! HTTP/1.0 400 Bad Request -

this code i'm using find latitude , longitude of place: function coords($address){ echo $url="http://maps.googleapis.com/maps/api/geocode/json?address=".$address; $json = file_get_contents(urlencode($url)); $data = json_decode($json, true); print_r($data['results'][0]['geometry']['location']['lat']); print_r($data['results'][0]['geometry']['location']['lng']); } however returns warning: failed open stream: http request failed! http/1.0 400 bad request if use above code in simple procedure works fine not in function. note: have tried curl_init()... method produced same result? instead of encoding whole url encode address part. following code work fine $add='jamshoro phase 2'; $url="http://maps.googleapis.com/maps/api/geocode/json?address=".urlencode($add); $json = file_get_contents($url); $data = json_decode($json, true); print_r($data['r...
Read more

command line - Use qwinsta in PowerShell ISE -

i trying use qwinsta , rwinsta powershell code. when try run error "the term 'qwinsta' not recognized name of cmdlet, function, script file, or operable program." need able remotely on several machines without having add .dll's or modules other machines. tried terminal services powershell module, need able put on remote machines , not able that. within powershell ise how run qwinsta? not looking parse information gather it. following code have tried (which had found on site also): function get-tssessions { param( $computername = "localhost" ) qwinsta /server:$computername | #parse output foreach-object { $_.trim() -replace "\s+","," } | #convert objects convertfrom-csv } get-tssessions -computername "localhost" | ft -autosize best have running powershell ise (x86). when run command qwinsta there same error you. of course assuming have 64-bit os. th...
Read more

java - Incorrect order of records in M-M relationship in hibernate -

Image
i have 4 records in bridge table in mysql database. using @manytomany in hibernate, accurate order of employees incorrect incorrect of projects. following required material figure out doing mistake. this source. @entity @table(name="project") public class projectbean { @id @generatedvalue @column(name="project_id") private int projectid; @column(name="title") private string projecttitle; @manytomany(mappedby="projects") private collection<employeebean> employees; public projectbean() { employees = new arraylist<employeebean>(); } //getters & setters } @entity @table(name="employee") public class employeebean { @id @generatedvalue @column(name="employee_id") private int employee_id; @column(name="first_name") private string ...
Read more