Jump to content

mikaelbrun

Members
  • Posts

    5
  • Joined

  • Last visited

Everything posted by mikaelbrun

  1. I have done a lot of tutorials both here, and at the Codeacademy, and I thought I understood, but I didn't :-) Most of the time, I find the w3schools helpfull, but I guess I strugle with the basic html setup. I know the meaning of most of the codes, but I don't always understand where to use them. Practice makes perfect :-D
  2. I see you have added a main container. Is the main container everything below the Title bar and navigation bar, while the container is the complete layout? EDIT: #container, #footer, #container > * What does the > * say? and why have you put # container two times?
  3. Thanks for the help, I will try to rewrite the code, and see if I understand. Great with the explanations. Thumbs up!!
  4. That was a helpfull tips. I had multiple errors, mostly the same errors, containing my use of <em>. Du I have to put this in a paragraph? Is that the reason I get theese errrors? Fruther, I get this error: Element div not allowed as child of element ul in this context. (Suppressing further errors from this subtree.) What does this say? Do I have to put every div outside a ul, and use something like <li id="something"></li> inside the ul?
  5. I'm trying to learn some html,CSS and jQuery, and doing so step by step. First I look at the html and CSS :-) I have made a layout design, but it doesn't appeare the way I want it to, and I don't know what I'm doing wrong. First of all I get unwanted space around my sections. I have tried to set both the padding and margin to 0px, but it doesn't dissapeare. Second problem is the border at the r-section, and the background-color at the l-section. I want those to go down to the bottom and stop at the footer-section. Third problem is the item5 and item 6 at the nav-section. I want those to be at the same line as the rest of the items. Can anyone go through my html and CSS, and tell me what I have done wrong here? <!DOCTYPE html><html><head> <title>myTitle</title> <meta charset="UTF-8" lang="nb"> <link rel="stylesheet" type="text/css" href="style2.css"> <script type="text/javascript" src="jquery"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script type="text/javascript" src="script2.js"></script></head><body> <!-- <div id="container"> --> <div id="t-section"> <h1>myHeading</h1> <p><em>t-section</em><p> </div> <div id="nav"> <!--Navigation bar--> <ul><em>nav-section</em> <li>item1</li> <li>item2</li> <li>item3</li> <li>item4</li> <div> <ul style="text-align:right"> <li>item5</li> <li>item6</li> </ul> </div> </ul> </div> <div id= "l-section"> <!--Left navigation bar/ section--> <ul><em>l-section</em> <li id="heading">heading1</li> <div class="sub1"> <ul> <li>item1</li> <li>item2</li> <li>item3</li> <li>item4</li> <li>item5</li> <li>item6</li> </ul> </div> <br> <li id="heading">heading2</li> <div class="sub2"> <ul> <li>alphabetic navigation</li> </ul> </div> <br> <li id="heading">heading3</li> <div class="sub3"> <ul> <li>item1</li> <li>item2</li> <li>item3</li> </ul> </div> </ul> </div> <div id= "r-section"> <!--Right section--> <br> <br> <p><em>r-section</em> <p>Something something something</p> </div> <div id="aticle"> <!--Main section at center of screen--> <br> <br> <p><em>main-section</em></p> <p>Text text text text</p> </div> <div id="footer"> <!--Footer at bottom of page--> <ul><em>footer-section</em> <li>info1</li> <li>info2</li> <li>info3</li> </ul> </div> <!--</div>--></body> </html> /* Styling for element selectors */html, body{ background-color: #fff; font-family: "Helvetica", "Courier", "Arial";}h1 {}h2 {}h3 {}p {}a {}ul {}li {}div {}/* Styling for id selectors *//*#container { min-height: 100%; position: relative;}*//* Title section */#t-section { background-color: #ffdf92; height: 100px; width: 100%; text-align: center; padding: 0; margin: 0;}/* Navigation bar */#nav { background-color: #272727; text-align: center; color: #fff; padding: 0; margin: 0;} /* Navigation bar elements */ #nav ul { list-style-type: none; } #nav li { display: inline; }/* Left section */#l-section { width: 200px; background-color: #7B6B4A; color: #FFD685; float: left; height: 100%;} /* Left section elements */ #l-section ul { list-style-type: none; }/* Right section */#r-section { border-left: solid 2px #C4BEB1; width: 300px; float: right; height: 100%;} /* Right section elements *//* Article section */#article { margin-left: 250px; padding-left: 1em; /*float: left;*/ height: 100%;} /* Article section elements */ #article p { padding-left: 15px; }/* Footer section */#footer { width: 100%; /*height: 1em;*/ text-align: center; font-weight: bold; font-size: 0.8em; position: absolute; bottom: 0; background-color: #272727; color: #fff;} /* Footer section elements */ #footer ul{ list-style-type: none; } #footer li{ display: inline; } #heading { background-color: purple;}/* Class */.sub1 { background-color: red; display: none;}.sub2 { background-color: blue; display: none;}.sub3 { background-color: green; display: none;} If I have posted this wrong, please let me know :-)
×
×
  • Create New...