Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations TouchToneTommy on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

CSS javascript header issue

Status
Not open for further replies.

adpk77

Programmer
Jun 18, 2006
20
GB
please see this site.
mazarspayroll.in

The page loads fine but whenever user moves the mouse over the services or downloads link on the top menu, a gap is created between tyhe header and navigation bar.

Previously the header image used to repeat itself which is not required. So i set the header image to no-repat within the css file. Instead now it does not repeat but creates that extra space or gap.

css code for those elements are below.

#head {
background:url("images/header.jpg") no-repeat scroll 0 0 transparent;
font-size:0.7em;
margin:15px auto 0;
padding:0;
width:960px;
}

#navbar {
background:url("images/navbar.png") no-repeat scroll 0 0 #2C2C2C;
margin:15px auto 0;
padding:0 10px;
text-transform:uppercase;
}

Using firefox and firebug. how do i sort this out? The other thing is that the services or download links are using javascript code to reload the page. Basically i wanted that if user clicks services or download links they they should be on that smae page so set it to page reload. This may be also causing that problem.

The links to those 2 menu items is set as javascript:this.location.reload();

is this causing the problem? problem is only in firefox and not in internet explorer 8.
 
Hi

adpk77 said:
whenever user moves the mouse over the services or downloads link on the top menu, a gap is created between tyhe header and navigation bar.
I noticed no gap. Also using FireFox. Could you show us a screenshot of that gap ? ( I attached what appears here. )
adpk77 said:
The links to those 2 menu items is set as javascript:this.location.reload();
Why not a single hash ( # ) character ?

Feherke.
 
you also mentioned about a single hash ( # ) character. please explain.
 
i saw the attachment.
do u notice the gap between the nav bar and header where the logo is.

 
Hi

You wrote :
adpk77 said:
whenever user moves the mouse over the services or downloads link
But the gap you are mentioning now is always present. So is it permanent or appears only on mouse over ?

Anyway, there is a practically unused [tt]div[/tt] with [tt]id[/tt] banner-region. Removing it seems to make the gap disappear.

Note that you can expect to get the rendering as you want only if you provide the markup as the browser expects.
W3C Markup Validation Service said:
[highlight #EAEBEE] Result: [/highlight] 50 Errors, 1 warning(s)

Feherke.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top