Log in

View Full Version : website help!


moler
09-12-2009, 21:00
hi ive been trying to get a spacing between two div tags to go away, i haven't been successful :( 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

Andrew Schreiber
10-12-2009, 12:06
<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.

JohnBoucher
10-12-2009, 12:29
Is it bad in all browsers? I can't see the DOC TYPE. Hard to replicate without it.

DMetalKong
10-12-2009, 13:41
<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>



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.

moler
10-12-2009, 14:59
thanks ill try that, the website is http://www.sabrerobotics.com

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

JohnBoucher
10-12-2009, 15:22
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?

moler
10-12-2009, 17:29
i'm hand coding it, thanks ill look at the errors