website help!

Technical Website Design/Showcase
1

hi ive been trying to get a spacing between two div tags to go away, i haven’t been successful :frowning: please help if you can

html : <div id=“wholesite”>
<div id=“mainbar”>
<div id=“gmlogo” onclick=“location.href=‘http://www.gmcanada.com’;” style=“cursor:pointer;”>
</div>
<div id=“topbar”>
<img src=“sr2.jpg” border=“0”>
</div>
<div id=“topright” onclick=“location.href=‘index.php’;” style=“cursor:pointer;”>
<div id=“logoname”>
</div>
<div id=“logo1” >
</div>
</div>
</div>
<div id=“menubar”>
<div id=“gmlogobottom” onclick=“location.href=‘http://www.gmcanada.com/’;” style=“cursor:pointer;”>
</div>
<div id=“flashmenu”>
</div>
<div id=“bottomleftpipe”>
</div>
</div>

CSS: * {
margin:0; padding:0;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #FF9900;
}
a:hover {
text-decoration: underline;
color: #666666;
}
a:active {
text-decoration: underline;
color: #666666;
}
#wholesite {
height: 100%;
width: 100%;
background-color:#000563;
margin:0;
}
#menubar {
height: 100%;
width: 25%;
background-image:url(‘stretchl.gif’);
background-repeat:repeat-y;
margin:0;
}
#mainbar {
background-image:url(‘stretcht.gif’);
background-repeat:repeat-x;
width: 100%;
float:left;
margin:0;
}
#gmlogo {
background-image:url(‘sr1_1.jpg’);
background-repeat:no-repeat;
width: 118px;
height: 108px;
float:left;
display: block;
padding: 0;
margin: 0;
border: 0;

}
#topbar {
background-image:url(‘sr2.jpg’);
background-repeat:no-repeat;
float:left;
margin:0;
}
#topright {
width: 343px;
height: 108px;
float:right;
margin:0;
}
#logoname {
background-image:url(‘sr3.jpg’);
width: 158px;
height: 108px;
float:left;
}
#logo1 {
background-image:url(‘logo1.jpg’);
width: 185px;
height: 108px;
float:right;
margin:0;
}
#gmlogobottom {
background-image:url(‘sr1_2.jpg’);
background-repeat:no-repeat;
width:118px;
height:66px;
display: block;
padding: 0;
margin: 0;
border: 0;
}

Thanks a lot

2 
<div id="wholesite">
<div id="mainbar">
<div id="gmlogo" onclick="location.href='http://www.gmcanada.com';" style="cursorointer;">
</div> 
<div id="topbar"> 
<img src="sr2.jpg" border="0"> 
</div> 
<div id="topright" onclick="location.href='index.php';" style="cursorointer;">	
<div id="logoname">
</div>
<div id="logo1" >
</div>
</div>
</div>
<div id="menubar">
<div id="gmlogobottom" onclick="location.href='http://www.gmcanada.com/';" style="cursorointer;">
</div>
<div id="flashmenu">
</div>
<div id="bottomleftpipe">
</div>
</div>

CSS: * {
margin:0; padding:0;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #FF9900;
}
a:hover {
text-decoration: underline;
color: #666666;
}
a:active {
text-decoration: underline;
color: #666666;
}
#wholesite {
height: 100%;
width: 100%;
background-color:#000563;
margin:0;
}
#menubar {
height: 100%;
width: 25%;
background-image:url('stretchl.gif');
background-repeat:repeat-y;
margin:0;
}
#mainbar {
background-image:url('stretcht.gif');
background-repeat:repeat-x;
width: 100%;
float:left;
margin:0;
}
#gmlogo {
background-image:url('sr1_1.jpg');
background-repeat:no-repeat;
width: 118px;
height: 108px;
float:left;
display: block;
padding: 0;
margin: 0;
border: 0;

}
#topbar {
background-image:url('sr2.jpg');
background-repeat:no-repeat;
float:left;
margin:0;
}
#topright {
width: 343px;
height: 108px;
float:right;
margin:0;
}
#logoname {
background-image:url('sr3.jpg');
width: 158px;
height: 108px;
float:left;
}
#logo1 {
background-image:url('logo1.jpg');
width: 185px;
height: 108px;
float:right;
margin:0;
}
#gmlogobottom {
background-image:url('sr1_2.jpg');
background-repeat:no-repeat;
width:118px;
height:66px;
display: block; 
padding: 0;
margin: 0;
border: 0;
}

What do you mean spacing? Do you mean the new line between two div tags? A screen shot would probably help here.

3

Is it bad in all browsers? I can’t see the DOC TYPE. Hard to replicate without it.

4

It’s hard to know exactly what you are asking from the markup, but it looks like you’re trying to have a header across the top of the page, with the GM logo to the left and some other logos to the right, followed by a content area with a nav bar on the left. If this is what you are going for, then it seems to work fine in FF3.5.5. One suggestion I will make though is get rid of the DIVs with the onclick events and change them to anchors with display set to block. Using javascript for links can get really annoying. Another thing, the #wholesite DIV is superfluous. You can apply the background to the body element for the same effect with one less tag.

5

thanks ill try that, the website is http://www.sabrerobotics.com

its the gm logo on the top left side of the page

6

Hi,
First thing to do is to correct the code. Run the url through the validator at W3C http://validator.w3.org/

I get 18 serious errors. Most will be resolved when you add the missing DOC TYPE.
One of the issues is that without a DOC TYPE it throws the browser into quirks mode, so it does not understand how to interrupt the code.

Are you hand coding or using a WYSIWYG program?

7

i’m hand coding it, thanks ill look at the errors