Graphic Design Forum and Web Design Forum  

Go Back   Graphic Design Forum and Web Design Forum »General »Graphic Design and Web Design Help

Notices

Graphic Design and Web Design Help Get Graphic Design and Web Design related help here


Reply
 
LinkBack (2) Thread Tools Display Modes
  2 links from elsewhere to this Post. Click to view. #1 (permalink)  
Old 29-10-2007, 12:23 AM
...Gav's Avatar
norks!
 
Join Date: Oct 2007
Gender: Male
Posts: 443
Default doctype problem

Iam currently building a website and everything is a'ok in firefox, safari etc but im getting nasty gaps between my header image and my image below the header which is just a pic of a line.

Now i know this is a doc type problem but cant find the right doc type does anyone know it?

this is the website:

White Hawk Designs

{only got a home page at the moment, i wanna fix this bug before i code the other pages}

Thanks guys
__________________
RSS me!
ghdesign-studio blog
Digg this Post!Add Post to del.icio.usBookmark Post in Technorati Share This Article & VoteReddit! Wong this Post!Stumble this Post!RSS Share on FacebookForum Netvibes Page
Reply With Quote

  #2 (permalink)  
Old 29-10-2007, 07:34 AM
PR Design's Avatar
CSS Wizardry -- Not Gay!
 
Join Date: May 2007
Location: Yorkshire, England
Gender: Male
Posts: 5,913
Default

Hmmmm, you don't have any html tags. I'd drop your current code into this set up:

Code:




<font color="Red">put original content here</font>




put original content here





EDIT: Don't know if that'll sort your image problem though.
Digg this Post!Add Post to del.icio.usBookmark Post in Technorati Share This Article & VoteReddit! Wong this Post!Stumble this Post!RSS Share on FacebookForum Netvibes Page
Reply With Quote
  #3 (permalink)  
Old 29-10-2007, 03:26 PM
SuperSmash's Avatar
Junior Member
 
Join Date: Oct 2007
Posts: 25
Default

Also, what's with the "Firefox" "Explorer" "Safari" "Opera" images at the bottom? Is that suggesting what browsers the website works in? I'd recommend against doing anything to the effect of "viewed best in blah-de-blah" as it is limiting and makes you look like you can only code to one or a few browsers. A good designer makes his sites work on as many browsers as possible (preferably all) and certainly doesn't sell himself short by saying "I only design sites for these browsers," even if it is the list of browsers that covers 98% of the internet-surfing population; it just makes you look like less than you are. Just a tip!
__________________
- Paul
Digg this Post!Add Post to del.icio.usBookmark Post in Technorati Share This Article & VoteReddit! Wong this Post!Stumble this Post!RSS Share on FacebookForum Netvibes Page
Reply With Quote
  #4 (permalink)  
Old 29-10-2007, 10:02 PM
...Gav's Avatar
norks!
 
Join Date: Oct 2007
Gender: Male
Posts: 443
Default

Tip taken on board, thanks dude
__________________
RSS me!
ghdesign-studio blog
Digg this Post!Add Post to del.icio.usBookmark Post in Technorati Share This Article & VoteReddit! Wong this Post!Stumble this Post!RSS Share on FacebookForum Netvibes Page
Reply With Quote
  #5 (permalink)  
Old 29-10-2007, 10:04 PM
...Gav's Avatar
norks!
 
Join Date: Oct 2007
Gender: Male
Posts: 443
Default

Harry, have tried your doctype dude, thanks for putting it up didnt remove the gap problem tho dammit!
__________________
RSS me!
ghdesign-studio blog
Digg this Post!Add Post to del.icio.usBookmark Post in Technorati Share This Article & VoteReddit! Wong this Post!Stumble this Post!RSS Share on FacebookForum Netvibes Page
Reply With Quote
  #6 (permalink)  
Old 29-10-2007, 11:41 PM
tommylogic's Avatar
f*ck yeah it validates!!!
 
Join Date: Apr 2007
Location: Virtually Everywhere
Gender: Male
Posts: 5,935
Default

Looks good to me... IE7

BUT... It's not W3C Compliant as you tout.

Markup Validation: FAILED 20 Errors

W3C CSS Validation: FAILED 2 Errors 49 Warnings

Opacity isn't valid per the CSS 2.1 standards (hopefully in 3.0)

SInce I like your design, I thought I'd throw this in for you:

White Hawk Designs in all Valid XHTML 1.0 Strict
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>White Hawk Designs</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="lightbox.css" type="text/css" media="screen" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<script type="text/javascript" src="js/prototype.js">
</script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects">
</script>
<script type="text/javascript" src="js/lightbox.js">
</script>
<style type="text/css">
/*<![CDATA[*/
 br.c1 {clear: both;}
/*]]>*/
</style>
</head>
<body>
<div id="header">
<div class="mainLogo"><img src="http://www.graphic-design-forum.com/images/header/logo.gif" width="286" height="137" alt="White Hawk Designs" title="White Hawk Designs" /></div>
<div id="topIcons">
<div class="icons"><a href="#"><img src="http://www.graphic-design-forum.com/images/header/homeIco.gif" width="76" height="104" alt="home" title="home" /></a></div>
<div class="icons"><a href="#"><img src="http://www.graphic-design-forum.com/images/header/portfolioIco.gif" width="76" height="104" alt="Portfolio" title="Portfolio" /></a></div>
<div class="icons"><a href="#"><img src="http://www.graphic-design-forum.com/images/header/servicesIco.gif" width="76" height="104" alt="Services" title="Services" /></a></div>
<div class="icons"><a href="#"><img src="http://www.graphic-design-forum.com/images/header/contactIco.gif" width="76" height="104" alt="Contact Us" title="Contact Us" /></a></div>
</div>
<div class="headerLine"><img src="http://www.graphic-design-forum.com/images/header/headerLine.gif" width="845" height="31" alt="** IMAGE DESCRIPTION **" /></div>
</div>
<div id="mainHolder">
<div id="homeLeft"><img class="designWords" src="http://www.graphic-design-forum.com/images/home/designWords.gif" width="274" height="79" alt="Design" title="Design" /> <!--START OF REVIEWS-->
<div class="reviews"><img src="http://www.graphic-design-forum.com/images/home/quoteOne.gif" width="11" height="9" alt="** IMAGE DESCRIPTION **" /> <span class="reviewText">I thought whitehawk did a fantastic job. I needed a new company logo and website and White Hawksdesign team understood exactly what I was looking for and delivered right on time.</span> <img src="http://www.graphic-design-forum.com/images/home/quoteTwo.gif" width="10" height="9" alt="** IMAGE DESCRIPTION **" />
<span class="reviewer">Michael Wakeham - Hampton Knight</span> <img src="http://www.graphic-design-forum.com/images/home/reviewArrow.gif" width="7" height="6" alt="** IMAGE DESCRIPTION **" /></div>
<div class="reviews"><img src="http://www.graphic-design-forum.com/images/home/quoteOne.gif" width="11" height="9" alt="** IMAGE DESCRIPTION **" /> <span class="reviewText">The next time I need some design work doing I know exactly who to call. White Hawk delivered exceptional work exactly when they said they would. And during the whole design process I was never kept in the dark.</span> <img src="http://www.graphic-design-forum.com/images/home/quoteTwo.gif" width="10" height="9" alt="** IMAGE DESCRIPTION **" />
<span class="reviewer">Tom Russell - London DJ</span> <img src="http://www.graphic-design-forum.com/images/home/reviewArrow.gif" width="7" height="6" alt="** IMAGE DESCRIPTION **" /></div>
<!--END OF REVIEWS-->
<img class="lineBreak" src="http://www.graphic-design-forum.com/images/home/lineBreak.gif" width="308" height="9" alt="** IMAGE DESCRIPTION **" />
<div id="companyPoints">
<ul class="bulletOne">
<li><span class="bullet">Professional and affordable web and graphic design</span></li>
<li><span class="bullet">All web designs coded to new web standards and for all web browsers (SAFARI, FIREFOX, I.E, OPERA)</span></li>
<li><span class="bullet">Exceeding expectations</span></li>
<li><span class="bullet">kept updated from start to finish</span></li>
</ul>
</div>
<img class="lineBreak" src="http://www.graphic-design-forum.com/images/home/lineBreak.gif" width="308" height="9" alt="** IMAGE DESCRIPTION **" /></div>
<!--END OF HOME LEFT-->
<div id="homeRight">
<div id="homeTop"><img class="titleArrow" src="http://www.graphic-design-forum.com/images/home/arrowTitle.gif" width="26" height="25" alt="** IMAGE DESCRIPTION **" />
<h1 class="welcome">Welcome</h1>
<img class="rightBreak" src="http://www.graphic-design-forum.com/images/home/lineBreakRight.gif" width="459" height="8" alt="** IMAGE DESCRIPTION **" />
<p class="homeText">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod <span class="homeTextGreen">White Hawk Designs</span> ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation <span class="homeTextGreen">White Hawk Designs</span> suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla <span class="homeTextGreen">White Hawk Designs</span> at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatu zzril delenit augue duis dolore te <span class="homeTextGreen">White Hawk Designs</span> nulla facilisi.</p>
</div>
<div id="homeBottom"><img class="titleArrow" src="http://www.graphic-design-forum.com/images/home/arrowTitle.gif" width="26" height="25" alt="** IMAGE DESCRIPTION **" />
<h1 class="welcome">Our Work</h1>
<img class="rightBreak" src="http://www.graphic-design-forum.com/images/home/lineBreakRight.gif" width="459" height="8" alt="** IMAGE DESCRIPTION **" />
<p class="homeText">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod <span class="homeTextGreen">White Hawk Designs</span> ut laoreet dolore magna aliquam erat volutpat. Ut wisi</p>
<div class="threeImages">
<div class="webImage"><a href="http://www.graphic-design-forum.com/images/image-1.jpg" rel="lightbox" title="Marketing Company web design"><img src="http://www.graphic-design-forum.com/images/home/webOne.gif" width="151" height="78" alt="Kumo" title="Kumo" /></a>
<span class="webImageText">clean web style</span></div>
<div class="webImage"><a href="http://www.graphic-design-forum.com/images/image-3.jpg" rel="lightbox" title="Estate agency company website"><img src="http://www.graphic-design-forum.com/images/home/webThree.gif" width="151" height="78" alt="Kumo" title="Kumo" /></a>
<span class="webImageText">Professional web style</span></div>
<div class="webImage"><a href="http://www.graphic-design-forum.com/images/image-2.jpg" rel="lightbox" title="Photographers personal portfolio"><img src="http://www.graphic-design-forum.com/images/home/webTwo.gif" width="151" height="78" alt="Kumo" title="Kumo" /></a>
<span class="webImageText">Advanced web style</span></div>
</div>
<p class="bottomHomeText">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod <span class="homeTextGreen">White Hawk Designs</span> ut laoreet dolore magna aliquam erat volutpat. Ut wisi</p>
<img class="w3ok" src="http://www.graphic-design-forum.com/images/home/w3Ok.gif" width="48" height="50" alt="w3c compliant" title="w3c compliant" /></div>
</div>
<br class="c1" /></div>
<div id="footer">
<div id="footerMenu"><img class="footerArrow" src="http://www.graphic-design-forum.com/images/footer/footerArrow.gif" width="25" height="23" alt="** IMAGE DESCRIPTION **" />
<ul>
<li><a href="#">Home</a></li>
<li>|</li>
<li><a href="#">Services</a></li>
<li>|</li>
<li><a href="#">Portfolio</a></li>
<li>|</li>
<li><a href="#">About Us</a></li>
<li>|</li>
<li><a href="#">Contact Us</a></li>
<li>|</li>
</ul>
<br class="c1" />
<img class="footerBreak" src="http://www.graphic-design-forum.com/images/footer/lineBreak.gif" width="339" height="7" alt="** IMAGE DESCRIPTION **" /></div>
<div id="footerMenuTwo">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</div>
<div id="footerMenuThree">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</div>
<img class="lineSide" src="http://www.graphic-design-forum.com/images/footer/lineSide.gif" width="8" height="90" alt="** IMAGE DESCRIPTION **" />
<div class="browsers">
<div class="browser"><img src="http://www.graphic-design-forum.com/images/footer/firefox.gif" width="55" height="60" alt="FireFox" title="FireFox" /></div>
<div class="browser"><img src="http://www.graphic-design-forum.com/images/footer/explorer.gif" width="55" height="60" alt="Internet Explorer" title="Internet Explorer" /></div>
<div class="browser"><img src="http://www.graphic-design-forum.com/images/footer/safari.gif" width="55" height="60" alt="Safari" title="Safari" /></div>
<div class="browser"><img src="http://www.graphic-design-forum.com/images/footer/opera.gif" width="55" height="60" alt="Opera" title="Opera" /></div>
<img src="http://www.graphic-design-forum.com/images/footer/xhtml.gif" width="66" height="26" alt="xhtml" title="xhtml" /> <img src="http://www.graphic-design-forum.com/images/footer/css.gif" width="66" height="26" alt="css" title="css" /></div>
</div>
</body>
</html>
be sure you go through and set your alt tags.. currently marked as -->
alt="** IMAGE DESCRIPTION **"

Good Luck man

**EDIT**
On second thought, you may consider soing this in XHTML 1.0 Transitional... less rules, but it's up to you.

Last edited by tommylogic; 30-10-2007 at 02:04 PM.
Digg this Post!Add Post to del.icio.usBookmark Post in Technorati Share This Article & VoteReddit! Wong this Post!Stumble this Post!RSS Share on FacebookForum Netvibes Page
Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is On
Trackbacks are On
Pingbacks are On
Refbacks are On


Similar Threads
Thread Thread Starter Forum Replies Last Post
Problem with IE spnwebdesign Graphic Design and Web Design Help 7 24-02-2008 03:07 PM
Beyond DOCTYPE: Web Standards, Forward Compatibility, and IE8 - Graphic Design Forum and Web Design Graphic Design Links Graphic Design Links 0 24-01-2008 07:40 PM
Beyond DOCTYPE: Web Standards, Forward Compatibility, and IE8 Toon CSS Forum 0 23-01-2008 07:08 PM
IE.. problem maiova CSS Forum 7 09-12-2007 06:23 AM
CSS / IE 6 -- what's the problem? inbetweendays CSS Forum 3 03-07-2007 03:04 PM


All times are GMT. The time now is 03:22 AM.



Estetica Design Forum's Privacy Policy
Powered by vBulletin® Version 3.7.3
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.2.0