How to assign CSS properties to aside tag


Tags: css

Problem :

I am trying to change the font family of an aside tag. I created the following section in my css file -

.instruction {
    color: brown;
    font: verdana;
}

and assigned aside, class = instruction. But it does not work. I have also tried using aside as an element in CSS to assign the properties like asign {property: value;}, but no effect.

But if I only use color property, then it works. So is there any issue with assigning font family and related properties to aside tag? I am using Chrome 28.



Solution :

Use font-family: verdana; instead of font: verdana and when you are using font shorthand properties care of the following order:

1. font-style
2. font-variant
3. font-weight
4. font-size/line-height
5. font-family

And also you cannot apply just one value in shorthand method. For font, it should at least two values for eg. font-siz and font-family

enter image description here

image source


    CSS Howto..

    HTML/CSS - How to set text (e.g. 'Quote of the Day') to change automatically on page load/reload?

    How can I make a fade in function without using jQuery like this? (JavaScript)

    How to get every line of text / elements of a page centered horizontally?

    How to set only vertical padding?

    How to make div scroll down with a page once it reaches top of page?

    How to position a CSS sprite background image within the element?

    How to auto adjust menus height according to container height

    How do you hide and show a background image using a carousel?

    How to add a space between paragraphs when using css reset? [closed]

    Space between list, space on left side of the ul. How to remove this?

    How to pass fontAwesome icon to CSS content via data attribute

    CSS: How to get an animated gif background-image on top of a div

    How to fill an HTML form with CSS?

    How Polymer Hero Transition works

    CSS How to embed several Font-Weights at once

    How can I fix Buttongroup Dropdowntoggle-Buttons in Bootstrap?

    How do I keep my footer at the bottom of the page without it coming up automatically to fill space if there is little content?

    How can I change the ckeditor iframe CSS styling

    How can I add text to a jQuery slider control?

    How to Find and replace class with javascript (No JQ)

    How to make html button look pressed in using css?

    How to implement Read more / Read less in pure CSS

    How to make a paragraph appear in a certain area in the page using Wordpress?

    How to vertically align text to the middle of a list

    Show/Hide Markers that are pulled from function

    How to change the css and html file at the same time

    How to cast a box shadow only on certain elements

    How to overlay a dynamically selected image over a dynamically populated div

    How does calc() CSS property degrade in older browser

    How to apply CSS to 2x2 classes?