Im having a problem aligning my Image on top of my Header.Im using this<img src="http://i30.tinypic.com/3499ao5.png" width="none" height="none"align="TOP" alt="Logo" title="" /> for trying to align my Logo on the left side of my header at the top I want it kinda evenly on top of my header.. But i cant do it somehow. I dont know what im doing wrong but its not going where i want it to go.Can someone help me ? here is a live link to my site. http://www.blakeanthonydesign.com here is the css <style type='text/css'> html, body, a, abbr, acronym, address, area, b, bdo, big, blockquote, button, caption, cite, code, col, colgroup, dd, del, dfn, div, dl, dt, em, fieldset, form, h1, h2, h3, h4, h5, h6, hr, i, img, ins, kbd, label, legend, li, map, object, ol, p, param, pre, q, samp, small, span, strong, sub, sup, table, tbody, td, textarea, tfoot, th, thead, tr, tt, ul, var { margin:0pt; padding:0pt; vertical-align:baseline; } body { -x-system-font:none; background:#666; color:#8a8b88; font-family:tahoma,verdana,arial,helvetica,sans-serif; font-size:85%; font-size-adjust:none; font-stretch:normal; font-style:normal; font-variant:normal; font-weight:normal; letter-spacing:1px; line-height:150%; margin:0pt auto; max-width:1150px; min-width:750px; } code, pre { white-space:pre; } del { text-decoration:line-through; } dfn { font-style:italic; font-weight:bold; } em { font-style:italic; } fieldset { border:0pt none; display:inline; } h1, h2, h3, h4, h5, h6 { -x-system-font:none; background:transparent none repeat scroll 0% 0%; color:#003567; font-family:georgia,garamond,"times new roman",times,serif; font-size:1em; font-size-adjust:none; font-stretch:normal; font-style:normal; font-variant:normal; font-weight:bold; line-height:1.5; } h1 { font-size:1.5em; } img { border:0pt none; letter-spacing:0pt; vertical-align:bottom; } ins { text-decoration:none; } strong { font-weight:bold; } tt { display:block; margin:0.5em 0pt; padding:0.5em 1em; } .award { float:left; margin:0pt 1em 0.5em 0pt; } .skip { left:-999em; position:absolute; } #container { background:#FFFFFF none repeat scroll 0% 0%; border-color:#e7e9dc; border-style:solid; border-width:0pt 1px; } #header { background:#FFFFFF url(images/header-bg.png) repeat-y scroll right top; border-bottom:2.5em solid #003567; border-top:1px solid #000080; color:#000000; height:80px; margin:0pt 0pt -2.5em; padding:0pt 0pt 0pt 1em; text-align:center; } #menu { background:#003567 none repeat scroll 0% 0%; height:2.5em; line-height:2.5em; padding:0pt 0pt 0pt 0.5em; } #menu li { display:inline; list-style-image:none; list-style-position:outside; list-style-type:none; white-space:nowrap; } #menu li a { background:transparent none repeat scroll 0% 0%; color:#FFFFFF; float:left; font-weight:600; height:2.5em; margin:0pt 0.5em 0pt 0pt; padding:0pt 0.5em; text-decoration:none; } #menu li a:hover, #menu li a:active, #menu li a:focus { color:#FFD700; } #content { background:#F3F3F3 none repeat scroll 0% 0%; border-top:1px solid #000080; color:#000000; float:left; margin:0pt -221px 0pt 0pt; width:100%; } #content .wrapper { background:#e7e9dc none repeat scroll 0% 0%; border-right:1px solid #000080; color:inherit; margin:0pt 220px 0pt 0pt; overflow:hidden; padding:1em 1em 0pt; } #content .wrapper h2 { font-size:1.25em; font-variant:small-caps; } #content .wrapper h3 { font-size:1.15em; font-style:italic; } #content .wrapper p { padding:0.5em 0pt; } #sidebar { background:#F3F3F3 none repeat scroll 0% 0%; border-color:#000080; border-style:solid; border-width:1px 0pt 0pt 1px; float:left; padding:1em 0pt; width:220px; } #sidebar * { padding:0pt 1em; } #sidebar * * { padding:0pt; } #search-form div { padding:0pt 0pt 0.5em; } #search-form legend span { background:transparent none repeat scroll 0% 0%; color:#003567; font-weight:bold; } #search-form label { left:-999em; position:absolute; } #search-form input { margin:0pt; vertical-align:middle; } #search-field { height:1.2em; width:115px; } #search-form .submit { padding:0pt 1px; } #sidebar ul { list-style-image:none; list-style-position:outside; list-style-type:none; } #footer { background:#F8F8EF none repeat scroll 0% 0%; border-bottom:1px solid #000080; border-top:1px solid #000080; clear:left; color:inherit; height:1%; padding:0.5em 0pt; text-indent:1em; } #footer em { font-style:normal; } #error404 { } #error404 h1 { -x-system-font:none; color:#DC143C; font-family:georgia,garamond,"times new roman",times,serif; font-size:1.5em; font-size-adjust:none; font-stretch:normal; font-style:normal; font-variant:normal; font-weight:bold; line-height:2; } #error404 p { padding:0pt 0pt 0pt 1em; } #error404 h2 { -x-system-font:none; font-family:georgia,garamond,"times new roman",times,serif; font-size:1em; font-size-adjust:none; font-stretch:normal; font-style:normal; font-variant:normal; font-weight:bold; line-height:1.5; margin:0.5em 0pt; } #error404 ol { list-style-type:lower-alpha; margin:0pt 0pt 0pt 2.4em; } #error404 ul { margin:0pt 0pt 0pt 1.5em; } #error404 strong { font-style:italic; font-weight:normal; } #error404 #search-field { width:16em; } #error404 small { color:#DC143C; display:block; font-size:0.85em; font-weight:bold; margin:2em 0pt 1em; } #error404 small span { font-size:1.25em; } #gb_form fieldset { display:block; padding:0.5em 0pt 0pt; } #gb_form legend span { background:#FFFFFF none repeat scroll 0% 0%; color:#000000; font-weight:bold; } #gb_form .fieldset .fieldset { background:#EEEEEE none repeat scroll 0% 0%; border:1px solid #999999; color:inherit; margin:1.5em 0pt 1em; padding:1em; position:relative; } #gb_form .fieldset .fieldset legend span { border:1px solid #999999; display:block; font-weight:normal; padding:0.25em 0.5em; position:absolute; top:-1em; } #gb_form .contact-info label { clear:left; float:left; margin:0pt 0pt 0.25em; padding:0.1em 0pt 0pt; vertical-align:middle; width:15em; } #gb_form .contact-info input { margin:0pt 0pt 0.5em; padding:0pt 0.25em; vertical-align:middle; width:14em; } #gb_form textarea { display:block; padding:0.5em 8px; width:550px; } #gb_form .whythis a { text-decoration:none; } #gb_form .whythis a span { color:#000000; display:none; } #gb_form .whythis a:hover span { display:inline; } #gb_form .submit { margin-top:0.25em; } </style> Code (markup): Here is the html <body> <div id="container"> <a id="top"></a> <div id="header"> <img src="http://i30.tinypic.com/3499ao5.png" width="none" height="none"align="TOP" alt="Logo" title="" /> </div> <ul id="menu"> <li><a href="/index.html" title="Homepage">Home</a></li> <li><a class="current-page" href="/about/" title="Information">Who I am</a></li> <li><a href="/services/" title="whatido">What I Do</a></li> <li><a href="/portfolio/" title="My Portfolio">My Portfolio</a></li> <li><a href="/writing/" title="BlakeAnthonyBlog">My Writing</a></li> <li><a href="/contact/" title="SendBlakeAnthonyMessage">Contact Me</a></li> </ul> <div id="content"> <div class="wrapper"> <h2>Proper Development, the problem</h2> <p> Hello welcome to BlakeAnthonyDesign My name Is Blake Tallos I am a Web Developer Ive been Developing websites for almost 4 years now. This Website was created in December, 2007. I am here to Design Logos banners Website's Creating Professional Templates. If interested i could give a affordable Quote. I love Promoting Bands, Organization's Etc. Im very Well known My work is Unique and worth Looking at. To see some of my Work Head over to My Portfolio. I work With Photoshop CS3, Indesign, Illustrator, Dreamweaver CS3, frontPage 2003, These Are Just some of the tools to make Your Website the best it could look. Lets Face it Your website can look beautiful Aesthetically but who cares if it isn't indexable by all the Search Engines? Search Engine Optimization (Seo),is something many individuals and businesses seem to lack People make website so other's can veiw them, But whats the point if nonone can find them from the Get go? The heart of any website is the initial Design by doing it the right way... </p> I specialize in creating accessible, easy to use Web sites using the bare minimum of clean, semantic and valid XHTML and CSS. I am also a member of (sitepoint.com) I am well Equipped into making your website the best it could look. </p> <h2>Conceptualize, Create, Captivate</h2> <p>As part of the partnership among your company and myself, I rely on your input to fuel this process. This input along with flexibility will be the determining factors of whether the final product is acceptable. I will take your input and refine, expand, or alter anything as needed. </p> <p>Those are the 3 C's to succcessful Web Development The first step is conceptualizing a business to understand to the fullest how a particular business is run. Secondly, to create the custom framework of the website to fit your businesses image. Last and most importantly, to captivate and serve to your businesses audience. I work to:</p> 1.Create inticing, standard complaint websites.<br> 2.Enhance credibility through simple, yet unique techniques.<br> 3.Increase brand recognition of the web.<br> </div> <div id="footer"> <em>Copyright © 2006-2008 <a href="http://blakeanthonydesign.com" rel="nofollow" title="BlakeAnthonyDesign">BlakeAnthonyDesign</a>. All rights reserved.</em> </div> </div> </body> </html> HTML:
The problem is that your #header div is only 80 pixels in height. Your logo is 300 pixels in height. You also need the align="left" tag in your image. Change your <img src../> to this (I re-uploaded the logo): <img src="http://i25.tinypic.com/4vg2km.png" alt="Logo" align="left"/> Code (markup): Should work.
Looks good to me I suppose the reason the other pages don't work is because you haven't done them yet?
Correct, Im in the process of doing alot of stuff in my site.. I have a question in ie7 and ie8 my logo is aligning Center? What can i do to make the logo align the same way like firefox 3.0 and also my lay out in ie7 atthe very top of the header there seems to appear a line going across the header can you help me to fix this?
To fix the alignment issue, take the text-align:center; Code (markup): out of your #header style. I'm not sure about the line though, as I can't see it.