Shoutbox

Sorry for being noob but.. - Printable Version

-Shoutbox (https://shoutbox.menthix.net)
+-- Forum: MsgHelp Archive (/forumdisplay.php?fid=58)
+--- Forum: Skype & Technology (/forumdisplay.php?fid=9)
+---- Forum: Tech Talk (/forumdisplay.php?fid=17)
+----- Thread: Sorry for being noob but.. (/showthread.php?tid=63073)
Sorry for being noob but.. by paperless on 07-11-2006 at 10:04 PM

What is wrong in here!?


code:
<style type="text/css">
#a.about {
    background-image: url(images/about.jpg);
    width: 59px;                   
    height: 41px;                   
    border:none;
    display: block;
    }
#a.about:hover {
background-image: url(images/abouthover.jpg);
}
</style>

<div id="about">
<a class="about" href="http://www.google.pt" ></a>
</div>

It isnt working .. :/
RE: Sorry for being noob but.. by Nathan on 07-11-2006 at 10:07 PM

code:
<style type="text/css">
#a.about {
background-image: url(images/about.jpg);
width: 59px;                   
height: 41px;                 
border:none;
display: block;
}
#a.about:hover {
background-image: url(images/abouthover.jpg);
}
</style>

<div id="about">
<a class="about" href="http://www.google.pt" ></a>
</div>
in the ( ) tags you have forogtten: ' or "

So this should work:

code:
<style type="text/css">
#a.about {
background-image: url('images/about.jpg');
width: 59px;                   
height: 41px;                 
border:none;
display: block;
}
#a.about:hover {
background-image: url('images/abouthover.jpg');
}
</style>

<div id="about">
<a class="about" href="http://www.google.pt" ></a>
</div>
RE: Sorry for being noob but.. by ShawnZ on 07-11-2006 at 10:08 PM

you're not supposed to put an # before tag names in css..

RE: Sorry for being noob but.. by paperless on 07-11-2006 at 10:10 PM

quote:
Originally posted by ShawnZ
you're not supposed to put an # before tag names in css..

lol thanks a lot that was exactly the problem :D
RE: Sorry for being noob but.. by paperless on 07-11-2006 at 10:56 PM

Sorry again people but how can i put this in the horizontal?

[Image: capt28112005221833110620062221.jpg]


Heres the full code:

code:
<style type="text/css">

a.about {
background-image: url('images/about.jpg');
width: 59px;                   
height: 41px;                 
border:none;
display: block;
cue-after:none;
}
a.about:hover {
background-image: url('images/abouthover.jpg');
}
</style>

<div id="about">
<a class="about" href="http://www.google.pt" ></a> <a class="about" href="http://www.google.pt" ></a></div>
RE: Sorry for being noob but.. by ShawnZ on 07-11-2006 at 11:09 PM

float: left;
width: 59px;
height: 100%;

RE: Sorry for being noob but.. by paperless on 07-11-2006 at 11:17 PM

Thanks shawnz, i dunno why but instaed of 100% i had to use 41px (which is equivalent to 100%).

RE: Sorry for being noob but.. by Val on 07-11-2006 at 11:48 PM

Hmm I can see that you are using a bit too much code there...
here is a more optimized version:

code:
<style type="text/css">

#about a{
background-image: url('images/about.jpg');
float: left;
width: 59px;                   
height: 100%;                 
border:none;
display: block;
cue-after:none;
}
#about a:hover {
background-image: url('images/abouthover.jpg');
}
</style>

<div id="about">
<a href="http://www.google.pt" ></a> <a href="http://www.google.pt" ></a></div>

As you can see now that "#about a" and "#about a:hover" is defined you don't need to put " class="about" " in the link element. I have bolded what I changed ;)
Hopefully you may find this helpfull :P
RE: Sorry for being noob but.. by RaceProUK on 07-13-2006 at 10:43 AM

quote:
Originally posted by ShawnZ
float: left;
width: 59px;
height: 100%;
Wouldn't it be simpler to use 'display: inline;'? Since inline is what he wants.

Edit: And to force it to be a navbar:
#about {
    display: block;
}