Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>You should read Johnathan Snook's book <a href="http://smacss.com/" rel="nofollow">Scalable and Modular CSS</a> for some insight for dealing with this problem. Not using classes on elements is your prerogative, but it's one of the most powerful tools we have for writing maintainable CSS. <a href="http://www.youtube.com/watch?v=R-BX4N8egEc" rel="nofollow">Harry Roberts' "Big CSS"</a> presentation also provides some powerful insight and tools for so-called "object-oriented" css. So, my first bit of advice is to start utilizing classes in your markup.</p> <p>I understand the concern for wanting to write semantic html, which is probably why you shy away from using classes - but classes on html elements do not detract from semantics, as long as you write them intelligently. In fact, they usually (always, really) provide more information about an element.</p> <p>The difficult part is writing classes that <em>are</em> semantic, that describe the function of an element rather than the presentation. <a href="http://developer.yahoo.com/ypatterns/" rel="nofollow">Yahoo's Design Pattern Library</a> is a really good place to get examples of semantic class names, as well as a great resource for many useful design patterns in web architecture.</p> <p><strong>As a brief tl;dr:</strong></p> <ol> <li><p>When organizing your CSS, use the cascade to your advantage. Set up your reset first, followed by global styles - these are generic layout styles applied directly to element selectors. Next, write your modules - these are your classes and they should be element-agnostic.</p></li> <li><p>Avoid qualifying your classes with tag selectors. In order to provide documentation and guidance for anyone else maintaining your site, you should use "quasi-qualified selectors" instead</p> <p>For instance, rather than:</p> <pre><code>div.carousel { /* style information here */ } </code></pre> <p>instead write: </p> <pre><code>/* div */ .carousel { /* style information here */ } </code></pre> <p>With this technique, you can provide documentation for how you expect your components to be used, without actually qualifying them and raising the specificity (thus destroying their modularity).</p></li> <li><p>Beyond all else, remember this: balance your specificity. Well-architected CSS sits right at the cusp of the general and the specific. You need to use classes in order to make your CSS modular and reusable, but you also need to avoid bloat.</p></li> </ol>
    singulars
    1. This table or related slice is empty.
    1. POCSS Optimization: Turning page-specific CSS into global?
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USBrendon Roberto
    1. USBrendon Roberto
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    1. COWhat a great first post! Welcome to SO
      singulars
      1. PO
      1. USBaumr
    2. COI have been meaning to read SMACSS for a while, thanks for the push — I'll get on it when I have some more time. With regards to #2, why do you suggest to avoid qualifying classes with tag selectors?
      singulars
      1. PO
      1. USBaumr
    3. COHarry Roberts explains it better than I ever could, but basically: it limits modularity and is less efficient. What if you, or someone else using your CSS framework wants to apply a module to a different, more appropriate html element in the future? By keeping classes separate from specific elements, your CSS is more future-proof. http://www.youtube.com/watch?v=R-BX4N8egEc&t=1595
      singulars
      1. PO
      1. USBrendon Roberto
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload