HTML - Header Problems
Hi,
I've been trying to add a full width header to my site with the account and view basket links in front of the header image. so far I have been unsuccessful. could someone advice how I would do this? i've attached a link to the image. Thanks, Adam Similar Tutorialshi, i've designed a website mainly in photoshop and sliced up and exported the finished images. However after adding headers(<H1>etc) in the main column, when testing the site in Firefox the graphics, flashmovies etc are pushed down the page and now unaligned with the background images by the header text because it is also now starting lower down the page than it did before in Explorer, which basically makes it look crap. The whole thing is working perfectly in Explorer but when opened in Firefox becomes unaligned and unusable. any help most appreciated many thanks Hello. First time here asking for help. Hope there's a solution! The site in question is http://www.jason-bradbury.com/Design.html. It's my first attempt at web design and I'm stumped. The goal is to present my art portfolio in a horizontal scrolling layout with a fixed header and footer. Ideally it would look identical across the many browser platforms. On a Windows laptop, my page looks and functions as it should in the latest browser versions of Safari, Google Chrome and Firefox as long as there aren't a stack of toolbars enabled. If toolbars are present (mostly in Firefox), the footer gets truncated and the page will not vertical scroll to allow it to be seen. So my first problem is getting the vertical scrolling (for the entire page including header and footer) to appear only when necessary in that situation. On my Mac Pro (I have not been able to test a Macbook yet) the page appears normal across the board with Safari and Firefox (have not tested Chrome or IE) The second problem is that in all versions of IE (and older versions of Firefox prior to 4.0) the page is displayed incorrectly. In IE, the header is missing, the left margin is way off and a vertical scrollbar is present for the body (again, if the vertical scrolling was for the entire page it wouldn't be so bad). As for the horizontal scrolling, it is very sluggish in IE. Firefox only has the vertical scrollbar in the body problem and since the header is shown in that browser, the body overlaps it when scrolled up. The page was originally designed in iWeb and then I had to tweak the code in Dreamweaver to get the fixed header and footer. Hope someone can help me out here! Cheers, Jason. Hey, im trying to find out why the header on my website isnt at the top of the page. it also moves sometimes even though the code appears to be all the same. the address is www.themonsterbox.com thanks in advance for any help. this is my page http://web.vtc.edu/users/cjb06271/CI...nal/order.html there are several things I would like to happen. 1. the right collumn background to be where the right collumn should be(so other links in navbar) 2.The test between the roach pictures to be alligned with the top rather than bottom of pictures (so smaller windows can see) 3. When you size the window smaller than the text, a scroll bar appears, and when you scroll the background no longer exists. If I put it on auto the background will only go as far as the text does. 4. (nice but not required)The cocroachs to be alligned to the left and right of the top bar respectively, and the text in the middle. 5. (nice but not required) the right column background image is being cut in half (as does the top one if you size small enough). any way to make the images ignore the collumns? don't worry about the colors I will be changing them soon Hi people. hope everyones ok http://www.airportcarhireliverpool.co.uk/ is my website and it looks fine on firefox but when i go to IE the nav is too low. i really dont know why and its doing my head in. also when we use ie 7 it re-directs to youtube? whattttttt? lol please help me!!! Thanks!! Hi guys, I've done design work before, but the website I just finished is my first stab at doing html & css by myself and I just have one problem that isn't working. There is a gap a few pixels high between the top images in my header and the bottom of the header where the navigation is. This gap doesn't appear in Firefox or Safari, only IE. Does anyone know how to fix this. The site can be seen on my company's test server at www.worthy-llc.com/pfpk. Thanks so much, it's a charity site and I want to make sure it gets done correctly. Brendan Hey guys just need a little help in getting a google adsense ad in the top right hand side of my website next to the header image.. Help is much appreciated thanks. My site http://www.prized4you.com Thanks in advanced hi, when i open web in internet explorer i see web without header and footer. then open with firefox i see web without header but i see footer. How to fix this problem and then i open web with every explorer i can see good web. sorry for english language. web url is www.xxlpramogos.lt hi, guys new here and to html. i am writing my code as, <div class="header"> Drums</div>, for example, now my trainer wants it in a span class so i can change the font and color etc, what is the next step to take? Hello, I purchased an already made website but what i would like to do is give a title to all pages but i don't know how. The website/template is .php I thought that i could copy and paste <title><?php echo $website_title; ?></title> but it does not work Hi, I'm not an expert with html and css and I'm having a problem with the header pushing down from the top. How can I fix this..and are there any other problems with my code? Thank you in advance! Here's my html Code: <!DOCTYPE html> <html> <head> <title>SevoDesign</title> <link rel="stylesheet" href="style.css" type="text/css" /> </head> <body> <div id="headerbg"></div> <div id="footerbg"></div> <div id ="wrapper"> <div id="header"> <h1><a href="#">sevodesign</a></h1> <ul id="nav"> <li><a href="#">home</a></li> <li><a href="#">portfolio</a></li> <li><a href="#">social networks</a></li> </ul> </div><!-- end header--> <div id="content"> <div class="mainpost"> <div class="postheader"> <h2>Hello World</h2> <h3>July 31, 2011</h3> </div><!-- end postheader--> <div class="postcontent"></div><!-- end postcontent--> </div><!-- end mainpost--> <div class="mainpost"> <div class="postheader"> <h2>Hello World</h2> <h3>July 31, 2011</h3> </div><!-- end postheader--> <div class="postcontent"></div><!-- end postcontent--> </div><!-- end mainpost--> </div><!-- end content--> <div id="sidebar"> <div id="search"> <div id="searchinput"> <a href="#"><img src="images/searchicon.png"/></a> </div><!-- end searchinput--> </div><!-- end search--> <div id="sidebox"> <div id="inside"> <ul id="links"> <li>Register</li> <li>Login</li> <li>Entries RSS</li> <li>Comments RSS</li> <li>WordPress.com</li> </ul><!-- end links--> </div><!-- end inside--> </div><!-- end sidebox--> </div><!-- end sidebar--> </div><!-- end wrapper--> </body> </html> and Here's the CSS: Code: body { margin: 0px; background-color: #eeeeee; } #headerbg { top: 0px; position: relative; height: 107px; width: 100%; background-repeat: repeat-x; background-image: url(images/header.jpg); } #wrapper { top: 0px; height: 807px; width: 960px; background-color: #fffd89; margin-left: -480px; left: 50%; position: absolute; } #footerbg { top: 660px; position: relative; height: 40px; width: 100%; background-repeat: repeat-x; background-image: url(images/footer.png); } #header { background-color: #b2ffce; top: 0px; position: relative; height: 107px; width: 960px; } h1 a { text-decoration: none; color: white; padding: 0px; margin: 0px; top: 0px; position: relative; float: left; text-transform: uppercase; letter-spacing: 1px; font-size: 36px; font-family: rockoultraflf; } #nav { position: relative; top: 15px; width: 400; float: right; padding: 0; list-style: none; } #nav li { float: left; } #nav li a { text-transform: uppercase; letter-spacing: 1px; text-shadow: 0px 1px 2px #252525; font-size: 18px; font-family: rockoultraflf; display: block; padding: 8px 13px; text-decoration: none; color: white; } #nav li a:hover { text-decoration: underline; } Hi, i use a far future expires header to speed up the loading of most of my pages. But i have one or two pages such as "latest updates" and such, which need to be reloaded each time the visitor visits. How do i define the expires meta tag thing so it will be reloaded every time? this is what i have so far, this is the far future version. Code: <meta http-equiv="expires" content="Wed, 26 Feb 2009 08:21:57 gmt"/> thanks. Hey everyone, hope your having a good a day! My header on my wordpress blog is appearing twice and I don't know why. It's fine on my homepage but on the other two pages, it appears twice! I would love some help with this but would prefer to PM my blog address if that's ok with you? Thank you, I really appreciate this because I'm a COMPLETE newbie and have no idea about html ect. Thanks again! Steve Good morning: I'm doing okay in the search engines, but I wonder if this is a good header: <HTML><HEAD><title>BestStudentViolins.com - Stringed Instruments and Sheet Music for Contemporary Musicians</title> <META NAME="Author" CONTENT="BestStudentViolins.com" /> <meta name="keywords" content="violin,viola,cello,bass,cases,bows,student violin,student violas,mandolin,guitars,sheet music,sheet music, free music / > <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" / > <meta name="description" content="beststudentviolins.com/ - BestStudentViolins.com/violins.html - Stringed Instruments and Sheet Music for Contemporary Musicians" / > <meta name="Identifier-URL" content=http://beststudentviolins.com /> <meta name="Classification" content="beststudentviolins.com/ - Stringed Instruments and Sheet Music for Contemporary Musicians" / > <meta name="Author" content="beststudentviolins.com/" customerservice@beststudentviolins.com / > <meta name="robots" content="index,follow" / > <META NAME="rating" CONTENT="General" /> <META NAME="revisit-after" CONTENT="15 days" /> <META name="resource-type" content="document" / > <meta name="copyright" content="Copyright (C) BestStudentViolins.com. All rights reserved." / > <meta name="distribution" content="global" / > ?? Thanks! Hello HTML experts. I need someone's help urgently. I am trying to obtain the header & footer html of my site. I know I'm supposed to go to VIEW SOURCE and whatnot....but then when I get there I get stuck as I do not understand this html stuff........ Please help me...... My site is dishnetworkoffers.net I'm having problems trying to create a header bar for my site. Basically I want something like the blue bar at the top at http://m.digg.com/ Essentially a bar that goes across the top of my site with a background color of my choice and my logo in the center of it. How would I go about doing this? On my website www.fresh-lobster.co.uk my footer displays 3 lists with various links, in a horizontal line (ul is floated left in the css). But the way i created the list headers was to put a the list header within an LI so it would format (margin etc) with the rest of the list. ul li --list header-- /li li --list item -- /li li --list item -- /li /ul But when viewing in non-css mode, it displays a disc like any other element in an LI. I tried using the LH (which is included in html3)... ul lh --list header-- /lh li --list item -- /li li --list item -- /li /ul But IE doesnt like it (even though Opera does). Is the LH element still functioning? or is there some other way of doing it. Thanks Thanks to Coothead over here I got what I wanted. Unfortunately the web is so .. how do you say it... polluted... that sometimes it is really hard to find what you want, not to say impossible. So I got: HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>driekleur pagina</title> <style type="text/css"> html,body { margin:0; padding:0; height:100%; } #linkerkolom { width:15%; height:100%; float:left; background-color:#776644; } #middelste_kolom { width:70%; height:100%; float:left; background-color:#fff; } #rechterkolom { width:15%; height:100%; float:left; background-color:#776644; } </style> </head> <body> <div id="linkerkolom"></div> <div id="middelste_kolom"></div> <div id="rechterkolom"></div> </body> </html> But how do you create a header? Lets say about 3 inches in height. And in the color black. I tried to do it but I failed. Anyone? hi..hopefully someone here will know a solution to my problem. i have made a page with a flash logo in the header section. now in ie7/firefox the page looks just about right. however in ie6 the flash logo appears above my page instead of where it should be. now i realize this may be because of how i have implemented the flash file. but i cant seem to figure it out..no matter what i do. i know i have some errors to correct in my code but none seem to be related to this specific problem. the problem is easy to see by comparing ie6 to ie7 if anyone can point me in the right direction it would be greatly appreciated. the site in question is www.nwotradingcards.com thanks for your help I am trying to make some code (see attachment) to look exactly like this page http://www.ultrapurecleanse.com/index.php. The attached code is the same as the source code of the URL, but it is not coming out the same in my html editor. There must be a way. For example, I am having difficulty getting the header to show up and the 5 bullet points on the top left to appear right on top of the big gray arrow as they should. Any help is really appreciated. Andrew |