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..

    How to contain imported css within a div

    How to disable and re-enable tabindex of hidden/visible elements?

    Selenium IDE - How to check that an element is (CSS) visible?

    How to get css properties set explicitly via the style attribute? [closed]

    How do I change my link's image on click?

    Why are items showing up in my instead of [closed]

    How to create column with two divs one fixed above second that hides behind first when scrolling?

    RoR - howto convert some HTML-elements with css to Rails

    How does this site hide the iframe scrollbar?

    How to add a play icon to Image on CSS

    How to make the visible part of png image with transparent background as a link?

    jQuery/CSS - How to style the first occurrence of an element inside of another element?

    How to make an Image overlay the site on click?

    How to edit CSS class via jQuery if statement

    How to use CSS Rotate() in TH Table Tags

    How to manage div positionning?

    How to change focus color when input is filled in with required attribute javascript/html/css

    How to use scss with css modules / postcss inside components

    How to dynamically add .css to a custom Javafx LineChart Node?

    How to make equal space between boxes in one row via CSS

    How can I vertically align this navigation bar?

    How do I keep my input fields on one line while centering the DIV that contains them?

    How can I set inline css styles for an element with javascript?

    on hover and on click how to fade out image and fade in content text

    How to change line height for small text with CSS? There seems to be a limit to how small line-height can be

    How do I style HTML in a JEditorPane?

    How to detect css properties in div

    How to get right sidebar up on main content on resize of flexible with page?

    How to animate sections in pure CSS when scrolling the page?

    How to change divs placing from horizontal to vertical using css?