Hi. I searched the forum for an answer, but it seem there are tons of different CSS rollover threads.
To cut to the point, I’m following this tutorial (http://www.kirupa.com/css/css_rollovers.htm), and everything was working out nicely until I noticed that my rollovers were appearing one on top of another instead of horizontal, which is how I thought they were going to appear considering how I was placing the coding.
Here is my CSS for the moment:
<style type=“text/css”>
#home{
height: 29px;
width: 71px;
text-indent: 10000px;
overflow: hidden;
background: url(homelink.jpg) top left no-repeat;
display: block;
}
#home:hover{
background-position: bottom left;
}
#about{
height: 29px;
width: 60px;
text-indent: 10000px;
overflow: hidden;
background: url(aboutlink.jpg) top left no-repeat;
display: block;
}
#about:hover{
background-position: bottom left;
}
</style>
</head>
<body>
<a href="#" id=“home”>Home</a><a href="[URL=“http://coldvic.livejournal.com/info”]#" id=“about”>About</a>
</body>
There is no <br> to make it go under the other, so I’m wondering how I can put them side-by-side instead? Thanks in advance! 