html interview questions
Top html frequently asked interview questions
I'm refactoring some old JavaScript code and there's a lot of DOM manipulation going on.
var d = document;
var odv = d.createElement("div");
odv.style.display = "none";
this.OuterDiv = odv;
var t = d.createElement("table");
t.cellSpacing = 0;
t.className = "text";
odv.appendChild(t);
I would like to know if there is a better way to do this using jQuery. I've been experimenting with:
var odv = $.create("div");
$.append(odv);
// And many more
But I'm not sure if this is any better.
Source: (StackOverflow)
I have a layout with two columns - a left div and a right div.
The right div has a grey background-color, and I need it to expand vertically depending on the height of the user's browser window. Right now the background-color ends at the last piece of content in that div.
I've tried height:100%, min-height:100%; etc.
Source: (StackOverflow)
In what situations is it more appropriate to use an HTML IMG tag to display an image, as opposed to a CSS background-image, and vice-versa?
Factors may include accessibility, browser support, dynamic content, or any kind of technical limits or usability principles.
Source: (StackOverflow)
How come certain random strings produce various colors when entered as background colors in HTML? For example:
<body bgcolor="chucknorris"> test </body>
...produces a document with a red background across all browsers and platforms.
Interestingly, while chucknorri produces a red background as well, chucknorr produces a yellow background.
What's going on here?
Source: (StackOverflow)
How do you disable autocomplete in the major browsers for a specific input (or form field)?
Source: (StackOverflow)
I have a layout similar to:
<div>
<table>
</table>
</div>
I would like for the div to only expand to as wide as my table becomes.
Source: (StackOverflow)
What is the reason browsers do not correctly recognize:
<script src="foobar.js" /> <!-- self-closing script tag -->
Only this is recognized:
<script src="foobar.js"></script>
Does this break the concept of XHTML support?
Note: This statement is correct at least for all IE (6-8 beta 2).
Source: (StackOverflow)
I've got some poorly-formatted HTML code that I'd like to reformat. Is there a command that will automatically reformat HTML code in Sublime Text 2 so it looks better and is easier to read?
Source: (StackOverflow)
When looking at most sites (including SO), most of them use:
<input type="button" />
instead of:
<button></button>
- What are the main differences between the two, if any?
- Are there valid reasons to use one instead of the other?
- Are there valid reasons to use combine them?
- Does using
<button> come with compatibility issues, seeing it is not very widely used?
Source: (StackOverflow)
What is the recommended way to embed PDF in HTML?
What does Adobe say itself about it?
In my case, the PDF is generated on the fly, so it can't be uploaded to a third-party solution prior to flushing it.
Source: (StackOverflow)
I'm looking for an HTML or ASCII character which is a triangle pointing up or down so that I can use it as a toggle switch.
I found ↑ (↑), and ↓ (↓) - but those have a narrow stem. I'm looking just for the HTML arrow "head".
Source: (StackOverflow)
I am currently working on a web application, where I want the content to fill the height of the entire screen.
The page has a header, which contains a logo, and account information. This could be an arbitrary height. I want the content div to fill the rest of the page to the bottom.
I have a header div and a content div. At the moment I am using a table for the layout like so:
CSS and HTML
#page {
height: 100%; width: 100%
}
#tdcontent {
height: 100%;
}
#content {
overflow: auto; /* or overflow: hidden; */
}
<table id="page">
<tr>
<td id="tdheader">
<div id="header">...</div>
</td>
</tr>
<tr>
<td id="tdcontent">
<div id="content">...</div>
</td>
</tr>
</table>
The entire height of the page is filled, and no scrolling is required.
For anything inside the content div, setting top: 0; will put it right underneath the header. Sometimes the content will be a real table, with it's height set to 100%. Putting header inside content will not allow this to work.
Is there a way to achieve the same effect without using the table?
Update:
Elements inside the content div will have heights set to percentages as well. So something at 100% inside the div will fill it to the bottom. As will two elements at 50%.
Update 2:
For instance, if the header takes up 20% of the screen's height, a table specified at 50% inside #content would take up 40% of the screen space. So far, wrapping the entire thing in a table is the only thing that works.
Source: (StackOverflow)
Ok, I'm now banging my head against a brick wall with this one.
I have an HTML (not XHTML) document that renders fine in Firefox 3 and IE 7. It uses fairly basic CSS to style it and renders fine in HTML.
I'm now after a way of converting it to PDF. I have tried:
- DOMPDF: it had huge problems with tables. I factored out my large nested tables and it helped (before it was just consuming up to 128M of memory then dying--thats my limit on memory in php.ini) but it makes a complete mess of tables and doesn't seem to get images. The tables were just basic stuff with some border styles to add some lines at various points;
- HTML2PDF and HTML2PS: I actually had better luck with this. It rendered some of the images (all the images are Google Chart URLs) and the table formatting was much better but it seemed to have some complexity problem I haven't figured out yet and kept dying with unknown node_type() errors. Not sure where to go from here; and
- Htmldoc: this seems to work fine on basic HTML but has almost no support for CSS whatsoever so you have to do everything in HTML (I didn't realize it was still 2001 in Htmldoc-land...) so it's useless to me.
I tried a Windows app called Html2Pdf Pilot that actually did a pretty decent job but I need something that at a minimum runs on Linux and ideally runs on-demand via PHP on the Webserver.
I really can't believe I'm this stuck. Am I missing something?
Source: (StackOverflow)