CSS Interview Questions and Answers
Prepare for your Interview today!
Test your skills through the online practice test: CSS Quiz Online Practice Test
Related differences
Ques 16. How do I quote font names in quoted values of the style attribute?
The attribute values can contain both single quotes and double quotes as long as they come in matching pairs. If two pair of quotes are required include single quotes in double ones or vice versa:
<P STYLE="font-family: 'New Times Roman'; font-size: 90%">
<P STYLE='font-family: "New Times Roman"; font-size: 90%'>
It's been reported the latter method doesn't work very well in some browsers, therefore the first one should be used.
Is it helpful?
Add Comment
View Comments
Ques 17. Why is my external stylesheet not working ?
There may be several different reasons behind that, but one very common mistake is to have an external stylesheet that contains HTML markup in some form.
An external stylesheet must contain only CSS rules, and if required, correctly formed CSS comments; never include any HTML syntax, such as <style type="text/css">?
CSS comments are defined as anything that is placed between
/* (the comment start mark) and
*/ (the comment end mark). I.e. as follows?
/* This text right here is a correct CSS comment */
CSS comments may span multiple lines in the stylesheet. Nesting of CSS comments is not allowed.
Another reason for external stylesheets (and even embedded and inline stylerules) not to function as expected may be that you have tried to make use of some CSS-features that are not supported in the browser you are using.
External stylesheets shall also be served from the www-server with a MIME-type of 'text/css' in its 'Content Type:' HTTP header.
You may need to negotiate with your server admin to add this MIME type to your server if you are not able to configure the server yourself.
Is it helpful?
Add Comment
View Comments
Ques 18. What can be done with style sheets that can not be accomplished with regular HTML?
Many of the recent extensions to HTML have been tentative and somewhat crude attempts to control document layout. Style sheets go several steps beyond, and introduces complex border, margin and spacing control to most HTML elements. It also extends the capabilities introduced by most of the existing HTML browser extensions. Background colors or images can now be assigned to ANY HTML element instead of just the BODY element and borders can now be applied to any element instead of just to tables. For more information on the possible properties in CSS, see the Index DOT Css Property Index.
Is it helpful?
Add Comment
View Comments
Ques 19. How do I make my div 100% height?
You need to know what the 100% is of, so the parent div must have a height set. One problem that people often come up against is making the main page fill the screen if there's little content. You can do that like this :
CSS
body, html {
height:100%;
}
body {
margin:0;
padding:0;
}
#wrap {
position:relative;
min-height:100%;
}
* html #wrap {
height:100%;
}
Here, the #wrap div goes around your whole page - it's like a sub-body.
You need to use 'min-height' rather than 'height' for Firefox because otherwise it will set it to 100% of the viewport and no more. Internet Explorer, being well... crap, treats 'height' as it should be treating 'min-height' which it doesn't recognise. (You can target IE by preceding your code with ' * html ').
To make floated divs within this #wrap div 100% of the #wrap div... well that's more difficult. I think the best way is to use the 'faux columns' technique which basically means that you put the background in your body rather than your columns. If the body has columns and your floats don't then it looks like your floated content is in a column that stretches to the bottom of the page. I've used this technique in my layout demos.
The problem is often not that the columns aren't 100% height, but that they're not equal lengths. Columns usually don't start from the top of the page and end at the bottom - there's often a header and a footer or sometimes, more interesting designs don't have a recognisable columnar layout, but do require div boxes to be equal heights. This can be done with the aid of a couple of images and some css or with some javascript.
Is it helpful?
Add Comment
View Comments
Ques 20. What is property?
Property is a stylistic parameter (attribute) that can be influenced through CSS, e.g. FONT or WIDTH. There must always be a corresponing value or values set to each property, e.g. font: bold or font: bold san-serif.
Is it helpful?
Add Comment
View Comments
Most helpful rated by users: