Databases
StackOverflow2013
Postsdbo
POHow to make this site browser independent
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to make this site browser independent
    text
    copied!<p>I got this page, and have some problems with ie &lt; 7 and opera 7.11</p> <p><a href="http://browsershots.org/png/original/c5/c5bac9b3838ba30cfebae2f03f896548.png" rel="nofollow noreferrer">This</a> is what i hoped to be the layout in all browsers, and these are the IE ones instead: <a href="http://browsershots.org/screenshots/97347e42778e88203c896cc3f30134bd/" rel="nofollow noreferrer">ie 5.5</a> and <a href="http://browsershots.org/screenshots/b53d6391290363ea1e7ada0e77bdca20/" rel="nofollow noreferrer">ie 6.0</a>.</p> <p>the xhtml is quite simple:</p> <pre><code>print "&lt;div id=\"page\"&gt; &lt;div id=\"header\"&gt; &lt;ul id=\"nav\"&gt; &lt;li&gt;&lt;a href=\"/\" class=\"first\"&gt;Címlap&lt;div&gt;Az oldal címlapja&lt;/div&gt;&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href=\"/blog\"&gt;Blogok&lt;div&gt;Minden bejegyzés&lt;/div&gt;&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href=\"/friss\"&gt;Friss tartalom&lt;div&gt;Aktuális témák&lt;/div&gt;&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;!-- header --&gt; &lt;div id=\"main\"&gt;&lt;div id=\"main-in\"&gt; &lt;div id=\"right\"&gt;"; do_boxes(); print " &lt;/div&gt; &lt;!-- right --&gt; &lt;div id=\"left\"&gt;"; do_content(); print"&lt;/div&gt; &lt;!-- left --&gt; &lt;/div&gt;&lt;/div&gt;&lt;!-- main --&gt; &lt;/div&gt;"; </code></pre> <p>Where a the content made from posts and a post looks like: </p> <pre><code> &lt;div class="post"&gt; &lt;h2&gt;&lt;a href="/blog/2/252/newcastleben-betiltottak-a-ketreces-tojast"&gt;Newcastleben betiltották a ketreces tojást&lt;/a&gt;&lt;/h2&gt; &lt;div class="author"&gt;warnew | 2008. october 16. 20:26 &lt;/div&gt; &lt;p&gt;Az angliai Newcastle Városi Tanácsa kitiltotta a ketreces baromfitartásból származó tojásokat az iskolai étkeztetésből, személyzeti éttermekből, rendezvényekről es a "hospitality outletekből".&lt;/p&gt; &lt;p&gt;A ketreces csirke- és pulykahúst még nem tiltották be, de vizsgálják a kérdést, ahogy a &lt;a href="http://en.wikipedia.org/wiki/Halal"&gt;Halal&lt;/a&gt; hús és a ketreces tojásból készült sütemények és tésztafélék tiltását is.&lt;/p&gt; &lt;ul class="postnav"&gt; &lt;li&gt;&lt;a href="/blog/2/252/newcastleben-betiltottak-a-ketreces-tojast%7D"&gt;Tovább&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="/blog/2/252/newcastleben-betiltottak-a-ketreces-tojast#comments"&gt;Hozzászólások (0)&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;!-- post --&gt; </code></pre> <p>and a box is like this: </p> <pre><code>&lt;div id="ownadbox" class="box"&gt; &lt;h5&gt;Viridis matrica&lt;/h5&gt; &lt;a href="http://viridis.hu/blog/2/172/nepszerusits-minket" title="Népszerűsíts minket"&gt;&lt;img src="http://viridis.hu/files/viridis_matrica_jobb.png" alt="viridis matrica"/&gt;&lt;/a&gt; &lt;/div&gt; </code></pre> <p>The -what i think is - relevan css:</p> <pre><code>body { background : transparent url(/images/design/background.png) repeat; } #page { margin : 0px auto; width : 994px; background : transparent url(/images/design/header.jpg) no-repeat top left; } div#header { width : 746px; margin : 0px auto; } div#header ul#nav { padding-top : 170px; margin-left : 3px; margin-right : 3px; border-bottom : #896e51 solid 7px; overflow : hidden; } div#header ul#nav li { display : block; float : left; width : 120px; margin-bottom : 7px; } div#main { width : 746px; margin : 0px auto; } div#main div#main-in { padding : 30px 20px; background : transparent url(/images/design/content-background.png) repeat-y top left; overflow : hidden; } div#main div#main-in div#left { width : 460px; overflow : hidden; float : left; } div#main div#main-in div#left div.post { clear : left; margin-bottom : 35px; } div#main div#main-in div#right { width : 215px; float : right; } div#main div#main-in div#right div.box { margin-bottom : 30px; clear : both; } </code></pre> <p>The live version is <a href="http://viridis.hu/index3.php" rel="nofollow noreferrer">here</a>, but after I got it fixed it's gona move - thats the reason behind the long codes in the post.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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