Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p><em><strong>Update:</strong> <a href="https://stackoverflow.com/a/38975118/230390">Matthew Wise has a really clever alternative solution</a> which you should consider—especially if you're having trouble with my approach or dislike ugly hacks!</em></p> <hr> <p>There is a way to cover windowed elements in IE with other elements, but you're not going to like it.</p> <h2>Background: windowed and windowless elements</h2> <p>Legacy IE categorises elements into two types: windowed and windowless.</p> <p>Regular elements like <code>div</code> and <code>input</code> are <strong>windowless</strong>. They are rendered by the browser itself in a single MSHTML plane and respect each other's z-order.</p> <p>Elements rendered outside of MSHTML are <strong>windowed</strong>; for example, <code>select</code> (rendered by the OS) and ActiveX controls. They respect each other's z-order, but occupy a separate MSHTML plane that is painted on top of all windowless elements.</p> <p>The only exception is <code>iframe</code>. In IE 5, <code>iframe</code> was a windowed element. This was <a href="http://support.microsoft.com/kb/177378" rel="nofollow noreferrer">changed in IE 5.5</a>; it is now a windowless element, but for backwards compatibility reasons it will still draw over windowed elements with a lower z-index</p> <p>In other words: <strong><code>iframe</code> respects z-index for both windowed and windowless elements</strong>. If you position an <code>iframe</code> over a windowed element, any windowless elements positioned over the <code>iframe</code> will be visible!</p> <h2>What this means</h2> <p>The PDF will always be painted on top of the regular page content—<a href="http://blogs.msdn.com/b/ie/archive/2006/01/17/for-the-select-few.aspx" rel="nofollow noreferrer">like <code>select</code> elements were until IE 7</a>. The fix is to position another <code>iframe</code> between your content and the PDF.</p> <h2>Demo</h2> <p>jsFiddle: <a href="http://jsfiddle.net/Jordan/gDuCE/" rel="nofollow noreferrer">http://jsfiddle.net/Jordan/gDuCE/</a></p> <h2>Code</h2> <p><strong>HTML:</strong></p> <pre><code>&lt;div id="outer"&gt; &lt;div id="inner"&gt;my text that should be on top&lt;/div&gt; &lt;iframe class="cover" src="about:blank"&gt;&lt;/iframe&gt; &lt;/div&gt; &lt;iframe id="pdf" src="http://legallo1.free.fr/french/CV_JLG.pdf" width="200" height="200"&gt;&lt;/iframe&gt; </code></pre> <p>​ <strong>CSS:</strong></p> <pre class="lang-css prettyprint-override"><code>#outer { position: relative; left: 150px; top: 20px; width: 100px; z-index: 2; } #inner { background: red; } .cover { border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: -1; } #pdf { position: relative; z-index: 1; } </code></pre> <h2>Support</h2> <p>This has been tested and should work in IE 7–9. If you feel persnickety about it showing up in the DOM for other browsers, you can add it with JavaScript or wrap it in an IE-only conditional comment:</p> <pre><code>&lt;!--[if IE]&gt;&lt;iframe class="cover" src="about:blank"&gt;&lt;/iframe&gt;&lt;![endif]--&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. POz-index does not work in Internet Explorer with pdf in iframe
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USJordan Gray
    1. USJordan Gray
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POz-index does not work in Internet Explorer with pdf in iframe
      singulars
      1. PTQuestion
    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. This table or related slice is empty.
 

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