ello ello,

Im having a spot of trouble with my CSS rollover thingy, and I cant quite grasp the problem. It is the same tutorial taking from here :

 

http://www.webdesignerforum.co.uk/topic/270-css-image-rollover-tutorial-horizontal-navigation/

 

here is the temporary link to the site im working on:

http://stasis-records.com/temp/rory/

 

as you can see up the top, the menu items needs to be shifted over by 190px to the right to align it with the background image, but i cant find the right place to do it without arsing it up? any help greatly appreciated here.

 

also, i cannot seem to colour the background, or remove that gap at the top, and ive no idea why. as above if you could help with out with this id appreciate it greatly.

 

/

 

thanks in advance

Change

#navigation ul {
color:#FFFFFF;
height:58px;
left:0;
list-style:none outside none;
margin:0 0 0 190px;
padding:0;
position:relative;
text-align:center;
top:0;
width:834px;

 

Change the hover positions these might not be correct

 

#navigation li.home a:hover {
background:url("images/menu_roll.jpg") no-repeat scroll -190px -58px transparent;
}
#navigation li.bio a:hover {
background:url("images/menu_roll.jpg") no-repeat scroll -326px -58px transparent;
}
#navigation li.news a:hover {
background:url("images/menu_roll.jpg") no-repeat scroll -462px -58px transparent;
}
#navigation li.concerts a:hover {
background:url("images/menu_roll.jpg") no-repeat scroll -598px -58px transparent;
}
#navigation li.works a:hover {
background:url("images/menu_roll.jpg") no-repeat scroll -734px -58px transparent;
}
#navigation li.contact a:hover {
background:url("images/menu_roll.jpg") no-repeat scroll -869px -58px transparent;
}

thanks for your help. ok the hover positions had an effect, and i can understand why i needed to do that.

although overall, it seems to have reversed the problem :\

 

http://stasis-records.com/temp/rory/

 

 

also im not quite sure what the first bit does.

 

thanks muchly for your reply.

you need to remove the background from #navigation ul

 

this allows you to add the 190px margin to your navigation ul without moving the bg image

 

hope that makes sense

 

I've edited this and the earlier post as I didn't realise your tabs were part of the wrapper background image

Brilliant, worked perfectly thanks.

sorry to be a pain, but do you have any insight as to why

 

body{ 
 margin: 0px;
 padding: 0px;
 background-color: #000;
}

 

 

 

has no efect on the page at all?

again, thanks a mill for your help

Edited April 6, 201016 yr by stjohn

any ideas guys? its obviously something totally basic, but for the life of me i dont know why the body tag wont do it..

sorry to be a pain, but do you have any insight as to why

 

body{ 
 margin: 0px;
 padding: 0px;
 background-color: #000;
}

 

 

 

has no efect on the page at all?

again, thanks a mill for your help

 

You haven't got

body{ 
 margin: 0px;
 padding: 0px;
 background-color: #000;
}

 

in this stylesheet http://stasis-records.com/temp/rory/style.css you've got

#body {
margin: 0px;
padding: 0px;
background-color: #000;
}

 

so edit it to body as #body is for a div id="body" not the page body.

excuse me while i go jump out a window

im a donkey.

 

thanks Wickham.

Yeah, do that and don't bother us with idiot questions again!!?!!

 

We've all done that sort of thing.

sorry to be a bother :\

Wickham's only joking mate

 

haha ... i told you, im a donkey!

respect to you guys, as always!