Note that there are some explanatory texts on larger screens.

plurals
  1. POWhy won't my webpage work in IE?
    primarykey
    data
    text
    <p>My webpage wont work with IE. I fully validated my webpage with W3C, and I made sure not to use anything that was not supported in all browsers (at least I think I did) I think I tested it with IE 8 (I don't have IE installed, just used a free webprogram)</p> <p>Basicly with IE the sidebar took up the full space of the page, and then the rest of the website went below the sidebar. By the way I cannot change things to absolute. (I absolutly can't change it to absolute haha) <a href="http://www.adrianhoulewebprojects.com/" rel="nofollow">http://www.adrianhoulewebprojects.com/</a></p> <pre><code>&lt;!--Home Page for adrianhoulewebpojects.com Version 1.0--&gt; &lt;!--Written by Adrian Houle--&gt; &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"&gt; &lt;html&gt; &lt;head&gt; &lt;link rel="stylesheet" type="text/css" href="css/HomePageStyle.css"&gt; &lt;meta http-equiv="Content-Type" content="text/html;charset=utf-8" &gt; &lt;title&gt;Adrian Houle Web Projects&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;div id="Sidebar"&gt; &lt;h3&gt;Projects&lt;/h3&gt; &lt;ul&gt; &lt;li&gt; &lt;a href="http://www.adrianhoulewebprojects.com/UnderConstruction.html"&gt;Under Construction&lt;/a&gt; &lt;/li&gt; &lt;li&gt;Unfinished Project #2&lt;/li&gt; &lt;li&gt;Unfinished Project #3&lt;/li&gt; &lt;li&gt;Unfinished Project #4&lt;/li&gt; &lt;li&gt;Unfinished Project #5&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;div class="box"&gt; &lt;div class="HalfSpacer"&gt;&lt;/div&gt; &lt;div class="TransBox" id="Header"&gt; &lt;h1&gt;Welcome to&lt;br&gt;AdrianHouleWebProjects.com&lt;/h1&gt; &lt;/div&gt; &lt;div class="Spacer"&gt;&lt;/div&gt; &lt;div class="TransBox" id=About&gt; &lt;h2&gt;About:&lt;/h2&gt; &lt;p&gt;Welcome to my website. I had a bit of time over the holidays and decided to finally get around to learning web programming. The purpose of this website is to give me a place to practice and display what I learn in the form of web projects. I may also be making some blogs that will also serve to showcase my travelling and hobbies. Note: If you are accesing this on a mobile phone you will probaly notice the side bars text is sticking out of its box; this is just part of the joys of web porgraming, I cannot fix it for this page without rewriting it, but my next web page will be compatible.&lt;/p&gt; &lt;/div&gt; &lt;div class="Spacer"&gt;&lt;/div&gt; &lt;div class="TransBox" id="NewStuff"&gt; &lt;h2&gt;Coming Soon&lt;/h2&gt; &lt;ul&gt; &lt;li&gt; &lt;h3&gt;Australia Travel Blog&lt;/h3&gt; &lt;img src="http://www.adrianhoulewebprojects.com/img/AustralianFlag100by50.gif" alt="Australian Flag" &gt; &lt;p&gt;2013-2014 Australia Travel Blog coming soon.&lt;/p&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;div class="Spacer"&gt;&lt;/div&gt; &lt;div class="TransBox" id="Contact"&gt; &lt;h2&gt;Contact Info:&lt;/h2&gt; &lt;p class="Italic"&gt;Please report any compatibility, accessibility, or security issues to:&lt;/p&gt; &lt;p&gt;Adrian Houle&lt;/p&gt; &lt;p&gt;adrianhoule@gmail.com&lt;/p&gt; &lt;/div&gt; &lt;div class="Spacer"&gt;&lt;/div&gt; &lt;div class="TransBox" id="Footer"&gt; &lt;p&gt;Website by Adrian Houle&lt;/p&gt; &lt;/div&gt; &lt;/div&gt; &lt;div class="BottomBorder"&gt;&lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>CSS code</p> <pre><code>/***************************************** Info *********************************************************/ /*Style Sheet for HomePage of adrianhoulewebprojects.com*/ /*Written by Adrian Houle*/ /*For any issues with my website (compatibility, accessibility, white-hat reports) feel free to contact me at adrianhoule@gmail.com /*Page Purpose: Create a homepage that welcomes users to my website and directs them to various projects*/ /***********************************************************************************************************/ /************************************* Table of Contents **************************************************/ /*CSS layout*/ /* -none specific elements*/ /* -classes*/ /* -ID's and children of ID's*/ /* -Other*/ /************************************************************************************************************/ /************************************** CSS code ****************************************************/ /* -none specific elements ***********************************************************************************/ p { font-size: large; font-weight: bolder; } a { color: blue; } a:hover, a:focus{ background-color: yellow; text-decoration: none; font-size: larger; } /* -classes **************************************************************************************************/ /*Element that contains everything except the sidebar and has the main background image.*/ .box { display: block; position: relative; width: 100%; /*test and adjust to keep it from expading the browser*/ height: 100%; border: 3px solid black; right: 0; top: 0px; padding: 0; background-image: url(http://www.adrianhoulewebprojects.com/img/CautionStripes.png); } /*Allows for synchronised space adjustment between elements*/ .Spacer { position :relative; height: 100px; } /*Allows for synchronised space adjustment between elements*/ .HalfSpacer { position :relative; height: 30px; } /*Every element that contains text belongs to this class*/ /*This class has nothing to do with transgender boxes, or gender boxes in general*/ .TransBox { width: 70%; padding: 1em; z-index: 1; left: 20%; position: relative; background-image: url(http://www.adrianhoulewebprojects.com/img/SteelPlate.jpg); moz-box-shadow: 0 0 5px 5px #888; /*shadow effect with cross compatibility*/ webkit-box-shadow: 0 0 5px 5px#888; box-shadow: 0 0 5px 5px #888; } .Italic { font-style: Italic; } /* -ID's and children of ID's********************************************************************************/ /*Sidebar, to be fixed to the left hand side of the screen. Must allow conent to the right of it*/ #Sidebar { height: 100%; width: 10%; left: 0px; top: 0px; padding: 2%; display: inline; position: fixed; background-image: url(http://www.adrianhoulewebprojects.com/img/SteelPlate.jpg); border-style: solid; border-width: 3px; z-index: 2; } #Sidebar ul { padding-left:0; } #Sidebar li { margin: 10%; } /*Header text*/ #Header h1 { text-align: center; } #Footer p { text-align: center; } /* -Other (empty)*****************************************************************************************/ </code></pre> <p>Thanks for any help.</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

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