|
HTML - Can't Get Content Under My Menu? Help.
When I start adding the content to my website, it pops up on top of the menu and the logo in the top of the page?
Do you know what I can do to get it under the menu? Here is my HTML and CSS Code HTML Code: HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset-UTF-8" /> <title>Andersen Undercover Records</title> <link rel="stylesheet" type="text/css" href="page.css" /> </head> <body> <ul id="nav"> <TABLE BORDER=0 BORDERCOLOR=black width="700"> <TR><td> <li><a href="#">HOME</a></li></td> <td><li><a href="#">ARTISTS</a></li></td> <td><li><a href="#">MUSIC</a></li></td> <td><li><a href="#">NEWS</a></li></td> <td><li><a href="#">VIDEOS</a></li></td> <td><li><a href="#">PHOTOS</a></li></td> <td><li><a href="#">ABOUT</a></li></td> <td><li><a href="#">CONTACT</a></li></td> </tr> </ul> <div id="content"> </body> </html> CSS CODE Code: * {
margin: 0;
padding: 0;
}
body {
font-size: 62.5%;
font-family: Helvetica, sans-serif;
background: url(images/background.png) repeat-x top
}
li {
font-size: 1.2em;
}
p {
font-size: 1.0em;
line-height: 1.4em;
margin-bottom: 0.8em;
}
ul#nav {
height: 290px; width: 894px;
margin: 0 auto;
background: url(images/logo.png) no-repeat;
list-style: none;
}
ul#nav li a {
display: block;
margin-top: 298px;
float: left;
width: 50px;
margin-left: 52px;
color: grey;
font-weight: bold;
text-decoration: none;
padding-top: 2px;
}
ul#nav li a:hover, ul#nav li a:active {
color: white;
div#content {
padding-bottom: 50px;
float:left;
}
div#footer {
background: url(images/)
color: white;
padding: 10px 0 10px 0;
text-transform: uppercase;
border-top: 0px solid black;
text-align: center;
}
Similar TutorialsI'm having trouble with my menu. the content displays properly when the menu drop-down boxes are not activated, but shifts to accomodate the boxes when they are activated (by rollover). I want the menu boxes to drop down OVER the content, not shift it out of the way. How do I accomplish this? Here is the page: http://antiqueatlantic.com/oceaniana...togallery.html in html, aside from using a table with 1 row and 2 cells..... what is the best way of designing a page where we have a menu system/navbar on the left, and the main content on the right of it? On my website I am trying to make a drop down menu change a script below it. If you go to http://www.breezybucks.com/article/newtemplate and click on "Custom Order Prizes" on the left you should see a drop down menu and an amazon flash file below it. I want it to be so that when you change from "Video Games" to "Electronics", it will load another flash file (from an already made amazon script). Here is my script right now... Quote: <select NAME="amazon"> <option>Video Games</option> <option>Electronics</option> <option>Books</option> </select> <Amazon Flash Script> <2nd Amazon Flash Script> Any idea how to do this? http://www.immc.ca/index.php?option=...d=24&Itemid=47 When you scroll over the drop down menu items, they appear behind the canada map flash piece. On other pages of the site, the menu appears correctly, in front of the site content. This is only happening in Firefox. can anybody give me a hand identifying why my content will not correctly align alongside my vertical website menu http://americanotaku.awardspace.com/index.htm Hey guys, I was wondering if anyone could help me? I wish to produce a website which works in the following way: The header and footer remain the same, and do not reload on page refresh. Then, links on a menu bar stimulate loading a new page, however only the content below the header changes. An example of this, is the CushyCMS website (http://www.cushycms.com). When you click the menu links, the header doesn't reload, only the page content does. How would I do this? My reason for wanting this method, is because I wish to have an image slider present within the header of all of my pages, and I don't wish to have to update every page each time I wish to add an image. Please help? Many thanks, Luke Hi There, Pulling my hair out over this. For the life of me, cant make it work: http://www.cowboytuffwebsitedesign.c...cialdeals.html I've used positive padding negative margin to stretch both div's heights to match each other. But the content div, when needed to be higher than the menu div, will overflow its content past the container divs bg. As well the footer will only clear past the menu div, not the content div. HELP! PLEASE! I can copy and paste HTML right into the thread if needed. Thanks Hi, Im trying to make my footer content align correctly to the main content when a window resizes. The apdivs don't seem to want to move at all even with a relative position etc. I have tried everything but just cant get it to work can someone help please? http://pjm.co.uk.uksite4.yourwebserv...splay&PageID=5 Also some one commented before on the amount of css and JS pages. These will al be stripped out as its an Open sources system im using! Thansk alot Joe Hey guys, I used to know a lot about html, but then just completely stopped doing anything with websites for too long. I was just wondering how I can replace a word or number with a specified word or number. What I want to achieve: I've got a forum with a couple thousand members and it's picking up in activity and I want to make some names stand out for being helpful. I want to replace their names with an image. But to do so, it'd have to be a code made and added into the footer template. Because obviously I can't edit a username for html image code. So I just need the code to find all instances of a certain username and replace it with what I specified. ------------- Man I really wish I remembered how to do this haha. Thanks guys. I am trying to get rid of the "You have to click to activate this function" mumbo jumbo for a site I am doing. I tried following these directions... http://www.adobe.com/devnet/activeco...devletter.html but am having a rough time getting it to work... here is my code. Code: <script type="text/javascript"> AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','900','height','140','src','GoodDock','quality','high','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','GoodDock' ); //end AC code </script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="900" height="140"> <param name="movie" value="images/GoodDock.swf" /> <param name="quality" value="high" /> <embed src="images/GoodDock.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="900" height="140"></embed> </object></noscript> Hello, I'm new to this forum, so first, hello! Actually, I'm new to web design in general but have taken on the role at the church I work at because our old site was a mess. I downloaded some nice looking templates and have been using them as a foundation. The site is www.miamibc.com. If you go there and look at the header menu (home, about us, etc), I want to consolidate that menu some and add a drop down menu with more choices. Is there a way I can do this while keeping it looking the way it does now? If you need any more info from me, let me know. Thanks for your help! Ben First I would like to know if there is a better way of doing this. <div></div> is the only way I know of doing it although others have told me they didn't even know it could be done with <div></div>. Second I would like to know if there's some way to control the speed at which the box scrolls. Third If the content is text then I want the scroll function to be vertical. There's other times I need the scroll to be horizontal. Here is the code: HTML Code: <div style="background-color: black; border-bottom-color: rgb(212, 47, 212); border-bottom-style: solid; border-bottom-width: 2px; border-left-color: rgb(212, 47, 212); border-left-style: solid; border-left-width: 2px; border-right-color: rgb(212, 47, 212); border-right-style: solid; border-right-width: 2px; border-top-color: rgb(212, 47, 212); border-top-style: solid; border-top-width: 2px; font-size: 11px; height: 200px; overflow-x: auto; overflow-y: auto; width: 200px;"> <span style="color:#ffffff;">CONTENT HERE</span></div> This is what the code looks like when viewed in Chrome and Firefox. However when used in IE the content can often move through the boarders. My index.html file is like this (www.omegaintertrade.ro) Quote: <html> <head> <title>Omega Intertrade Test Site</title> <link rel='stylesheet' rev='stylesheet' href='global.css'type='text/css' media='screen' charset='utf-8' /> </head> <body> <div id='wrapper'> <div id='wrapper2'> <div id='header'><img src="logo.jpg" height = 120 border="0" hspace="25" > </div> <div id='leftcolumn'> <ul> <li><a href="index.html">Home</a></li> <li><a href="mb.htm">About Me</a></li> <li><a href="mb.htm">Products </a></li> <li><a href="mb.htm">Contact</a></li> </ul> </div> <div id='rightcolumn'><div class= "bheader">This column is intentionally blank!</div> </div> <div id='bodytext'> <div class= "bheader">Home</div> Main text area <br> stay with omega to see the further developments</div> <div id='footer'>Footer</div> </div> </div> <body> </html> As you may see it is consist of header footer and 3 columns in the middle. While visitors navigate through menus only bodytext content will change. For example after registering the site, a small message will appear like 'thank you for registering' on bodytext. How should i place that message in the page(on "bodycontent")? Should i create another html document exact like index.html except changing the content of the "bodycontent" section. This idiot solution comes to my mind Is there another short and easy solution? Hello to all experts in HTML, I want to know, because when I try to print the contents of a DIV I print all text except the images. I created a DIV centered on my page, and inside there is some text and a background image. I haven't used the <IMG> tag for the background image but the style: background-image:#; <div> <a class="print" href="#" onclick="window.print()"><img src="icon.png" /><br />Print</a> <div id="content"> <p> eccc...... </div> </div> Can you please explain me, why I did not print from what I see from my browser? Thank you! ps. Sorry for my bad English. Hi!!! It's my fist post here, so i'll try to make it good My problem is: I want to show an embed video to only users, who press my link. e.g, Someones press my link, and it unlocks the frame, where the video is. Even better would be if it could know, that the person pressed like 5 times this week, and so after 5 times (at different days), it would unlock content. But I could get myself with the first too... So could anybody show me, how to do that P.S. I'm Lithuanian, so I'm sorry for my poor English skills. MUCH THANKS!!! I have been a hobbyist web developer for a lil bit but I have been looking for this info but I dont think my search terms are corrent... What I want to do is make a page that has the side menu, Header, Footer. Stay the same but have links and pages that would change inside the content part of the site. Embarrassingly what I have been doing is making copies of the index file for each page . I Know there must be a better way. If someone could shed some light on my problem. Bradley This question might be rather basic. I'm not a web-developer, though I have a lot of other coding experience. As part of an internal webpage I'm creating, I want to access a webservice that returns a string and display it on the page. The service is accessed by URL, and requires parameters that are dynamically generated base upon the request parameters, so I can't just use #include. What I want to see is something like this, where the number string is provided by the webservice: Authorization code: 1343-7205-7570-8264 I tried this: Code: Authorization code: <object type=text/plain data="http://blah/service?params"></object> IE doesn't output the resulting string. Firefox does output the string, but it's not cleanly inlined with the rest of the text. It has it's own big block of the screen that the text sits in. Is there a simple way to insert the text from a dynamically generated URL into the current page? Hi all, brand new here. I'm working on a simple website for a project I'm doing with a friend, but I'm having a problem with the layout. The site is www.Project217.com. On my Macbook, the content on all of the pages appears centered, which is where I want it. Firefox, Safari and IE all display properly. However, on my Windows computer at work all of the content within the black section of the pages is aligned to the left. Is there an issue with my source code that I'm missing? Thanks for any help, Aaron Not sure where to put this.. Is it possible to include off-site content [Content from other websites] into your own page and style it accustomed to your page? For Example: If Website A has a table of data, could I somehow grab that data and include it in my site, but then have it altered according to my CSS to look how i want? Hi, I have a table containing 2 nested tables. The left nested table contains a vertical navigation menu, and the right nested table I want to use for content. I want to be able to click a link on the navigation menu, and only have the content in the right nested table change, without having to reload a new page everytime. The reason I want to do it this way is to edit one set of links and not have to copy and paste the menu into each new page I create. Otherwise link management becomes a real hassle when I make future changes. Thank you. |
|||||||