www.webdeveloper.com
Results 1 to 3 of 3

Thread: begging for help

  1. #1
    Join Date
    Jul 2005
    Posts
    1

    begging for help

    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

  2. #2
    Join Date
    Aug 2004
    Location
    Ankh-Morpork
    Posts
    19,633
    It can be done with CSS styling of a UL list:

    HTML:
    HTML Code:
    <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:
    Code:
    #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;
    }
    "Please give us a simple answer, so that we don't have to think, because if we think, we might find answers that don't fit the way we want the world to be."
    ~ Terry Pratchett in Nation

    eBookworm.us

  3. #3
    Join Date
    Feb 2003
    Location
    Michigan, USA
    Posts
    5,774
    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 (hence the existence of this forum section ), 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 to finally see the light.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles