Click to See Complete Forum and Search --> : begging for help


griidlocked
07-12-2005, 06:32 AM
i will try to explain this in the most simple way i can because i understand it is very confusing....

visit http://htmlgoodies.com (you see the content on the right...hover over each link and see how each link has its own personal box which also highlights when u hover over?) i also see this on http://pink-baby.com

this is the type of look i am going for when revamping my site however i notice this is mostly done with php...is it possible to do with html? is it the same as image slice? or is it a code? have any of you tried this type of thing before?

im dying to know the answers to my questions...so ANY help would be highly appreciated. i'd be grateful if you could even link me to a tutorial on how this works. plleease

NogDog
07-12-2005, 12:06 PM
It can be done with CSS styling of a UL list:

HTML:

<ul id=nav>
<li><a href="index.html">Home Page</a></li>
<li><a href="page2.html">Page Two</a></li>
<li><a href="page3.html">Page Three</a></li>
<li><a href="page4.html">Page Four</a></li>
</ul>

CSS:

#nav {
float: left;
background-color: #fff;
color: #e6fffd;
font-weight: bold;
width: 11em;
margin: 0 0 10px 0;
padding: 0;
list-style: none;
}
#nav li {
margin: 2px 0;
padding: 0;
line-height: 1em;
}
#nav a {
background-color: #b34000;
display: block;
color: #e6fffd;
text-decoration: none;
text-align: center;
width: 9em;
padding: 5px 3px;
margin: 0 auto 0 0;
}
#nav a:hover {
background-color: #FF5C00;
}

toicontien
07-12-2005, 12:06 PM
First, you'd have better luck posting this question in the General, HTML or CSS sections. Probably General would have been best. This section is specifically for Web page accessibility issues.

The "boxes" you speak of are done by using Cascading Style Sheets to transform the link tag to a block element, where it takes up as much width as possible and can be given a width and height.

PHP is a server-side scripting language. No PHP is ever read and worked with by a Web browser. The PHP engine gets PHP files and spits out HTML files which get sent to Web browsers.

There's also this thing called accessibility (http://www.w3.org/TR/WCAG10/) (hence the existence of this forum section :D ), meaning that HTML tags are used to describe data, and DIV tags and CSS are used to give meaningful HTML a look and feel.

HTML Goodies teaches HTML from 1998. A lot has changed since then. If you use it, be sure to get to know HTML then head to A List Apart (http://www.alistapart.com/) to finally see the light.