CSS - Problems With A Website Templatt!!!
Hi all,
I'm building a website, and am experiencing a few problems with the site template. Was wondering if somebody could take a look? The files can be found at: http://www.ashleycox.co.uk/template,zip Basically what's happening is the background image in the top right hand corner only fills a small amount of the box. If anybody could take a look at my code and point me in the right direction it would be much appreciated! Thanks :-) Similar Tutorialshi there I'm having a problem on my website, First off my drop downs take a longtime to load and I need some advise on how to make my drop downs load first and faster. Secondly my drop downs on the home page appear behind the flash which is very annoying and help will be appreciated. Ok, I've completed w3c validation, there were about 33 errors and it now shows green, saying the page was validated. However, the website is not aligned properly, I'm not sure if it's css or html. Can you guys help me further to getting it aligned and proper? Site: aspekt.blogdns.com/ahs/layout2/index2.php Thanks again for all the help guys. //index2.php Code: <?php include 'header.php'; include 'blocks.php'; ?> <div id="maincontent"> <table width="875" cellspacing=0 cellpadding=0 border=0> <tr> <td valign="top" bgcolor="#e5e5e5"> <strong>Welcome</strong> <p> eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. </p> </td> </tr> </table> </div> </body> </html> // header.php Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>AHS v2</title> <link rel="stylesheet" href="css/main.css" type="text/css"> <link rel="stylesheet" href="css/menu-style.php" type="text/css"> <script type="text/javascript" src="css/menu.php"></script> </head> <div id="pagewrapper"> <div id="header"> <a href="/"></a> </div> <table border='0' cellspacing='0' cellpadding='0'width="875"> <tr> <td colspan="2"> <div id="nav"> <ul id="udm" class="udm"> <li><a tabindex="10" title="Students" class="nohref">Students</a> <ul> <li><a tabindex="10" title="Alumni" href="">Alumni</a></li> <li><a tabindex="10" title="Blue Pride" href="">Blue Pride</a> <ul> <li><a tabindex="10" title="Overview" href="">AHS Music</a></li> <li><a tabindex="10" title="Overview" href="">Athletics</a></li> <li><a tabindex="10" title="Overview" href="">Boosters Club</a></li> <li><a tabindex="10" title="Overview" href="">Community Service</a></li> </ul> </li> <li><a tabindex="10" title="Student Work Drop Down" class="nohref">Student Work</a> <ul> <li><a tabindex="10" title="AHS Music" href=""><i>Eagles Eye</i></a></li> <li><a tabindex="10" title="Athletics" href="" target="_blank">Jewelry</a></li> <li><a tabindex="10" title="Boosters" href="">Multimedia</a></li> </ul> </li> </ul> </li> <li><a tabindex="10" title="Parents" class="nohref">Curriculum</a> <ul> <li><a tabindex="10" title="" href="">AHS Rubrics</a></li> <li><a tabindex="10" title="" href="">Career and Technical Programs</a></li> <li><a tabindex="10" title="" href="" target="_blank">Guidance</a></li> <li><a tabindex="10" title="" href="">NEASC</a></li> <li><a tabindex="10" title="" href="">Program of Studies</a></li> </ul> </li> <li><a tabindex="10" title="Community" class="nohref">Information</a> <ul> <li><a tabindex="10" title="" href="">Announcements</a></li> <li><a tabindex="10" title="" href="">Blue Notes</a></li> <li><a tabindex="10" title="" href="">Calendar</a></li> <li><a tabindex="10" title="" href="">Contact Information</a></li> <li><a tabindex="10" title="" href="">Directions</a></li> <li><a tabindex="10" title="" href="">Handbook</a></li> <li><a tabindex="10" title="" href="">Health Center</a></li> <li><a tabindex="10" title="" href="">Mission Statement</a></li> <li><a tabindex="10" title="" href="">Parent Connection</a></li> <li><a tabindex="10" title="" href="">Summer Reading</a></li> </ul> </li> <li><a tabindex="10" title="Utilities" href="">Contact</a></li> </ul> </div> </td> </tr> </table> </div> // blocks.php Code: <div id="blockcontent"> <table align="right"> <tr> <td valign="top" width="200"> <table cellspacing=0 cellpadding=4 border=0> <tr bgcolor="#cccccc"><td> <strong>Account Login</strong> <p align="left"> <form name="login" method="post" action="login.php"> <br> <div align="left"> Username: <input name="myusername" type="text" id="myusername"> <br> Password: <input name="mypassword" type="text" id="mypassword"> <br></div><br> <input type="submit" name="Submit" value="Login"> </form> </td></tr> <tr><td><img src="/Graphics/blank.gif" height=1 width="200" ALT=""></td></tr> <tr bgcolor="#cccccc"><td> <a style="font-weight:bold;" href="/calendar/">Calendar of Events</a><p /> <center> <table class="calendar"> <tr> <td align="center" valign="top"> </td> <td align="center" valign="top" class="calendarHeader" colspan="5">December 2006</td> <td align="center" valign="top"> </td> </tr> <tr> <td align="center" valign="top" class="calendarHeader">S</td> <td align="center" valign="top" class="calendarHeader">M</td> <td align="center" valign="top" class="calendarHeader">T</td> <td align="center" valign="top" class="calendarHeader">W</td> <td align="center" valign="top" class="calendarHeader">T</td> <td align="center" valign="top" class="calendarHeader">F</td> <td align="center" valign="top" class="calendarHeader">S</td> </tr> <tr> <td align="center" valign="top" class="calendar"> </td> <td align="center" valign="top" class="calendar"> </td> <td align="center" valign="top" class="calendar"> </td> <td align="center" valign="top" class="calendar"> </td> <td align="center" valign="top" class="calendar"> </td> <td align="center" valign="top" class="calendar"><a class="calendar" onMouseOut="kill();" onMouseOver="popup('<strong>Events on 12/1/2006</strong>03:00 pm Testing javapopup event <br/>','#ddd','0');">1</a></td> <td align="center" valign="top" class="calendar">2</td> </tr> <tr> <td align="center" valign="top" class="calendar">3</td> <td align="center" valign="top" class="calendar">4</td> <td align="center" valign="top" class="calendarToday">5</td> <td align="center" valign="top" class="calendar">6</td> <td align="center" valign="top" class="calendar">7</td> <td align="center" valign="top" class="calendar">8</td> <td align="center" valign="top" class="calendar">9</td> </tr> <tr> <td align="center" valign="top" class="calendar">10</td> <td align="center" valign="top" class="calendar">11</td> <td align="center" valign="top" class="calendar">12</td> <td align="center" valign="top" class="calendar">13</td> <td align="center" valign="top" class="calendar">14</td> <td align="center" valign="top" class="calendar"><a class="calendar" onMouseOut="kill();" onMouseOver="popup('<strong>Events on 12/15/2006</strong>11:00 am Testing javapopup event <br/>','#ddd','0');">15</a></td> <td align="center" valign="top" class="calendar">16</td> </tr> <tr> <td align="center" valign="top" class="calendar">17</td> <td align="center" valign="top" class="calendar">18</td> <td align="center" valign="top" class="calendar">19</td> <td align="center" valign="top" class="calendar">20</td> <td align="center" valign="top" class="calendar">21</td> <td align="center" valign="top" class="calendar">22</td> <td align="center" valign="top" class="calendar">23</td> </tr> <tr> <td align="center" valign="top" class="calendar">24</td> <td align="center" valign="top" class="calendar">25</td> <td align="center" valign="top" class="calendar">26</td> <td align="center" valign="top" class="calendar">27</td> <td align="center" valign="top" class="calendar">28</td> <td align="center" valign="top" class="calendar">29</td> <td align="center" valign="top" class="calendar">30</td> </tr> <tr> <td align="center" valign="top" class="calendar">31</td> <td align="center" valign="top" class="calendar"> </td> <td align="center" valign="top" class="calendar"> </td> <td align="center" valign="top" class="calendar"> </td> <td align="center" valign="top" class="calendar"> </td> <td align="center" valign="top" class="calendar"> </td> <td align="center" valign="top" class="calendar"> </td> </tr> </table> <br /> <a href="/eventRequest/">Submit an Event</a> </center> </td></tr> <tr><td><img src="/Graphics/blank.gif" height=1 width="200" ALT=""></td></tr> <tr bgcolor="#dddddd"><td> <strong>Box number 2</strong> <br><br> Loreum Ipsum </td></tr> <tr><td><img src="/Graphics/blank.gif" height=1 width="200" ALT=""></td></tr> <tr bgcolor="#cccccc"><td> <strong>Site Statistics</strong> <p align="left"> <a href="/visiting/">Visitors:</a><br /> <br /> </p> <p align="left"> <strong>Session Information:</strong><br /> 0 minute, 0 second<br /> Language: English<br /> </p> <p align="left"> <strong>Page Generation:</strong><br /> Generated in 0 seconds </p> </td></tr></table> <p /> </td> </tr> </table> </div> Hi guys I have a simple Wordpress website and I don't know anything about CSS I used a visual CSS editor called stylise to change a few things but I can't seem to get the spacing I can't put the URL here because I am a new member, but look at the pics and you will figure it out. Actually urls in pictures are removed as well so no pics. Website is theinterviewkit dot com What I want done is some simple spacing: The add to cart button doesn't line up I the store page, it is ok when I check the website on safari and Firefox, but on my iPad the add to cart button is beside the quantity box. I'd like it under Have images I marked up but The forum doesn't allow urls in posts of new users!!!!!! check store page When you click on the product and go to the product page, the add to cart is slightly to the left of the name and price. I would like it Lined up where the red line is. On safari and my iPad, it is as you see in the screen shot. On Firefox though, the add to cart button is under the picture. Unfortunately when I tried editing, any change I did moved the add to cart button on each page that had it (store page and every product page). I'm guessing because I'm editing that element instead of the spacing of the page. Had Image here but no urls allowed. Check product page Again, I don't know anything about CSS, only very very basic HTML. If anybody could figure it out that would be awesome. I am developing a web site, panopticinsight dot com. The header/banner looks fine in Firefox. In IE7 and Opera, the H2 subtitle is left aligned over the globe image. In IE6 content jumps outside of container. Anyone know why there is a shift, and what I can do about it? Style sheet code pasted below: Code: body { width:800px; font:0.83em/1.4em Tahoma, Geneva, sans-serif; color:#CBD4E3; background:#000 url(images/body_bg.gif) repeat-y top center; letter-spacing:1px; margin:0 auto; } h1,h2,h3,h4,h5,h6 { font-family:"Times New Roman", Times, serif; font-style:italic; font-weight:bold; color:#e9df55; background-color:#000; } h2 { font-size:2em; } h3 { font-size:1.5em; } h4 { font-size:1.25em; } a:link { color:#8090AC; text-decoration:none; } a:visited { color:#B17F6C; text-decoration:none; } a:hover { color:#E9DF55; text-decoration:underline; } a:active { color:#E9DF55; text-decoration:none; } #container { width:760px; margin:0 auto; } #header { height:200px; width:760px; margin:0; padding:0; } #banner { height:100%; width:100%; color:#cbd4e3; background:#000 url(images/header_bg.jpg) no-repeat top left; margin:0 auto; padding:0; } #banner h1 { font-size:400%; color:#CBD4E3; background-color:transparent; float:left; display:inline; margin:0; padding:70px 0 70px 280px; } #banner h2 { font-size: 12pt; color: #e9df55; background-color:transparent; text-indent: 200pt; vertical-align: text-bottom; } navigate{ color : #105BAC; background-color : transparent; height : 20px; font-size: 100%; border-top : 1px solid #999999; } #navigate ul { list-style-type: none; margin-top: 0px; margin-bottom: 0px; margin-left: 150px; margin-right: 0px; padding: 2px 0 0 0; } #navigate ul li { display: inline; } td { font-family: Arial, Helvetica, sans-serif; } th { font-family: Arial, Helvetica, sans-serif; } p { font-size: 14px; color: #FFFFFF; left: 50px; right: 50px; } #main { width: 660px; padding-right: 50px; padding-left: 50px; } #footer { font-family: "Times New Roman", Times, serif; font-size: 9px; color: #666666; height: 100px; width: 760px; vertical-align: text-bottom; text-align: center; } #SplashImage { float: left; } .image-left { clear: none; margin-bottom: 10px; float: left; margin-right: 20px; margin-left: 10px; } .image-right { clear: none; margin-bottom: 10px; margin-left: 10px; float: right; } Hey, I need someone to look at my website html/css and fix a few errors for me. I'm unable to fix them. I'll pay you! Its a quick fix I think and should not take too long. Kris Hi, I just registered with this forum because I cannot seem to solve a problem. I'm not a web developer or aspire to become one, I'm a photographer and I've decided to update my website using CSS (I've been reading here and there to learn about it). It's taking me a lot longer than I thought but I'm not willing to give up yet. I've uploaded to my server (where I have my current site) three pages not linked yet that will be part of the new website. http://www.barbarabadettipalumbo.com/ratesindexnew.html http://www.barbarabadettipalumbo.com/childrengallery/childrenportraitindexnew.html http://www.barbarabadettipalumbo.com/aboutindexnew.html I've placed the navigation in the footer and in the :aboutindexnew" page the footer doesn't stay at the bottom of the page as in the previous two pages but appears in the container. I tried clearing the footer and other things but cannot figure it out how to do it. I would also like to know how two reduce the space between the two columns of text and how to move the photo closer to the text. Any help or other advice will be appreciated as I've already spent way too many hours on this. Thanks for reading. Barbara Someone recently recommended that I redo my website in all CSS. I started, but I can't do it for the life of me, I just don't know enough. If you want to see what I have so far, the page that I doing with all CSS is located here. The css file is here. I'm sorry if this seems like a big thing to ask in the forums. Any help is appreciated. runenation.com (By know means is this a advertisement, I'm not even ready for members yet!) I want that skin to expand the whole page. The skin is only random, I will edit the pictures and stuff later. Quote: body { background-color: #B0B0B0; text-align: center; margin-top: 50px; } #topline { background-color: #29363E; height: 9px; } #logocell { background-color: #FFFFFF; width: 174px; height: 134px; } #maintable { width: 770px; text-align: left; } #menu { background-color: #29363E; border-top-width: 1px; border-top-style: solid; border-top-color: #FFFFFF; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #FFFFFF; vertical-align: top; text-align: left; padding-top: 20px; padding-right: 10px; padding-bottom: 20px; padding-left: 20px; } #menu a { font-family: Arial, Helvetica, sans-serif; color: #AEB6BB; font-size: 10pt; text-decoration: none; line-height: 1.4em; } #menu a:hover { font-family: Arial, Helvetica, sans-serif; color: #797B00; font-size: 10pt; text-decoration: none; line-height: 1.4em; } /*================================================================================ >> Main Menu Links ================================================================================*/ td.vmenu_main_off { width: 100%; border: 0px; padding: 0px 0px 0px 0px; } td.vmenu_main_on { width: 100%; border: 0px; padding: 0px 0px 0px 0px; } div.vmenu_main_off { width: 100%; font-size: 13px; font-weight: normal; } div.vmenu_main_on { width: 100%; font-size: 13px; font-weight: bold; } /*================================================================================ >> Main Menu Links END ================================================================================*/ /*================================================================================ /* Sub Menu Links ================================================================================*/ td.vmenu_sub_off { width: 100%; border: 0px; padding: 0px 0px 0px 15px; } td.vmenu_sub_on { width: 100%; border: 0px; padding: 0px 0px 0px 15px; } div.vmenu_sub_off { width: 100%; border: 0px; padding: 0px 0px 0px 15px; font-size: 9pt; font-weight: normal; } div.vmenu_sub_on { width: 100%; border: 0px; padding: 0px 0px 0px 15px; font-size: 9pt; font-weight: bold; } /*================================================================================ /* Sub Menu Links END ================================================================================*/ #maincontent-index { background-color: #FFFFFF; width: 365px; text-align: left; vertical-align: top; padding-top: 20px; padding-left: 20px; padding-right: 15px; padding-bottom: 20px; } #maincontent-index h1 { font-family: Arial, Helvetica, sans-serif; color: #797B00; font-size: 16px; font-weight: bold; text-decoration: none; } #maincontent-index p { font-family: Arial, Helvetica, sans-serif; font-size: 9pt; font-weight: normal; text-decoration: none; color: #000000; } #maincontent-index2 { background-color: #FFFFFF; width: 560px; text-align: left; vertical-align: top; padding-top: 20px; padding-left: 20px; padding-right: 15px; padding-bottom: 20px; } #maincontent-index2 h1 { font-family: Arial, Helvetica, sans-serif; color: #797B00; font-size: 16px; font-weight: bold; text-decoration: none; } #maincontent-index2 p { font-family: Arial, Helvetica, sans-serif; font-size: 9pt; font-weight: normal; text-decoration: none; color: #000000; } #footer { background-color: #29363E; height: 20px; border-top-width: 1px; border-top-style: solid; border-top-color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; color: #AEB6BB; text-decoration: none; font-size: 8pt; text-align: right; padding-right: 10px; padding-top: 4px; } #rightcontent { background-color: #FFFFFF; width: 196px; vertical-align: top; padding-top: 20px; padding-bottom: 10px; } #promo { width: 188px; border: 1px solid #9A9B9D; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 10px; } #promo2 { width: 188px; border: 1px solid #9A9B9D; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 10px; } #promo h1 { font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold; color: #D0440F; text-decoration: none; margin-bottom: 2px; } #promo p { font-family: Arial, Helvetica, sans-serif; font-size: 8pt; color: #000000; text-decoration: none; font-weight: normal; margin-top: 0px; } Hello, My header (please click here ) looks good on IE7 but not on FF and IE6 hi there mail.diskbank.com.au:8080/rmbclient/ywam just wanted to find out the issue here associated wih my webpage on ie7. ive looked at the css and tinkled for hours but i cant explain why my website content has moved to the left by about 140px on ie7, whereas on every other browser, its OK. any help appreciated. thanks hey i need some help. the website and the css is good and works normally...however when i edited the website file through Dreamweaver MX, it got distorted!!!...the only thing I changed was the "page properties title name" and that was it and after that the right side of the frame shifted below the menu which was on the left side!!!! i even went back to change the title name back but it wouldn't go back to its original left right style. what do i do? My site looks as expected in IE, but Netscape...Fotget it. I can't figure it out, i've been at it for a long time. goto www.eldore.com Attached is my css file. Thanks My site looks as expected in IE, but Netscape...Fotget it. I can't figure it out, i've been at it for a long time. goto www.eldore.com Thanks I am porting over a Nucleus CMS skin to WordPress and I am about 90% done with the port... http://www.jamesmeister.com/mom/ as you can see, the ID #wrapper is not being let by the sidebar and is causing major headaches. it is supposed to look like this: http://skins.nucleuscms.org/blog/16 My CSS file is located he http://jamesmeister.com/mom/wp-content/themes/stanch2/style.css Can anyone figure out what could be the problem and how to fix it? Thanks! Hi I am rather novice at CSS and what it can do but thought I would see if anyone can offer any feedback. I have been asked to resize the following website: http://www.Ihaveone.org Currently it takes up a third of the window and it is requested to take up the whole window. Is there an easy way to do this? I have downloaded all the files to Adobe GoLive, but am unclear if or how this can be done without redesigning the entire site. Please, any help is greatly appreciated! bufhal Hello, can someone please take a look at this site: http:// www . jamandcheese . be/dump/index.html As you can see, I'm having some trouble. 1. I can't get the navigation to work properly. It needs to be vertically centered and the sliding doors hover effect isn't quite right. Don't know how to solve this one! 2. under the white box (i'll add a slideshow later) there are two buttons. The bottom text overlaps the text above. How can i solve this? And how can i get the hover effect to work? When you hover over, text needs to become white with dark text-shadow. 3. the 2 lists at the bottom are floating left. They need to be centered like the screenshot below. When i give both ul a margin, they jump underneath each other. Please help! So I have uploaded my site via dreamweaver to my web host. Everything looks great through the editor (even under 'Live View'). When I actually type in my website in the browser only parts of the back round show up! I've tried editing everything that I possibly can (to my knowledge). Can someone please help?! Thanks so much My site: tyspetservices DOT com Thanks again guys ! Hi guys, so my css website is centered in safari and mozilla, but not IE can anybody help me please? I have tried and tried all sorts of trouble shooting but just cant see where I've gone wrong If anyone can highlight what I need to change and tell me how to change it would be brilliant! thanks in advance HERE IS MY CSS FILE Code: @charset "utf-8"; /* CSS Document */ body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; } #container { margin: 0 auto; width:850px; background-image:url(../images/bg.jpg); background-repeat:repeat-x; } #header { height:73px; width:850px; margin:auto; } #logo { margin-left:30px; margin-top:15px; position:absolute; color:#FFFFFF; font-family:Arial, Helvetica, sans-serif; font-size:30px; } #toplinks { margin-left:245px; position:absolute; width:590px; color:#33ff99; } #toplinks ul { list-style-type:none; margin-top:55px; } #toplinks li { display:inline; } #toplinks a { font-family:Arial, Helvetica, sans-serif; font-size:12px; text-transform:uppercase; color:#ff33ff; text-decoration:none; padding-left:12px; padding-right:12px; } #toplinks a:hover { background-image:url(../images/linksbg.jpg); background-repeat:no-repeat; background-position:center; color:#000000; text-decoration:none; padding-left:12px; padding-right:12px; padding-top:10px; } #bodypart { width:814px; margin:auto; padding-top:15px; } #bodypart2 { width:850px; margin:auto; padding-top:40px; } gallery img{ border:none; margin: 0px 4px 4px 0px } #footer { width:850px; margin:auto; height:60px; line-height:20px; } .footerlinks { color:#9933ff; font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; text-transform:uppercase; } .blackboldtext { font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; } At some point, something I did caused my website to have around 400 pixels of white space above it. My site is very simple but I can't seem to figure out the cause. I'm hoping someone can take a look and figure it out. Thanks for any help, Chris HTML CODE: http://www.bottomtimedesign.com CSS CODE: Code: @charset "utf-8"; /* CSS Document */ body { background-color: #FFFFFF; text-align: center; } /*defines web page dimensions and centers page */ #pagedimensions { background-color: #DCDBC9; border: none; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; margin-right: auto; margin-left: auto; margin-top: 0px; margin-bottom: 0px; position: relative; width: 1024px; height: 768px; text-align: left; } #mask { position: absolute; left: 575px; top: -45px; } #sign { margin-left: 50px; float: left; margin-right: 50px; } #snorkel { position: absolute; top: 390px; left: -39px; } #header { float: right; margin-right: 20px; margin-bottom: 0px; margin-top: 10px; } #content { margin-left: 50px; margin-right: 155px; position: static; margin-top: 300px; } I've tested my newly built website in Chrome, Firefox, Opera, Safari and various incarnations of IE. IE 6 and earlier aren't displaying it correctly, all the others are. I'm no CSS (or even HTML) whizz, but I've had a go - I've built my site from patching together parts of various templates and examples, and don't understand enough to get to the botom of what's happening. I'm feeling properly fed up with it. I'd be eternally grateful if someone could take a look and tell me how to fix it. As I'm a new site member I can't post links, so sorry for all the odd URLS. Obviously xxx is www but I'm not allowed to post that. I'm really sorry if I'm breaking rules here, but I'm unsure how else to ask anybody for any help . If I should do something differently then please let me know. My sites he xxx.conkerphotography.co.uk This is what happens to the homepage in IE is he xxx.conkerphotography.co.uk/ie6home.png and what happens to the gallery page is he xxx.conkerphotography.co.uk/ie6gallery.png My CSS for the homepage is he xxx.conkerphotography.co.uk/style2.css and the gallery is here (pretty much the same thing): xxx.conkerphotography.co.uk/style.css Many, many thanks to any genius who can tell me how to mend this. Mark |