SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Mar 2002
    Posts
    70
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    gifs horizontal -- yippee, skippee! BUT

    even though their labels are now underneath them, they are not directly underneath them, but rather, just slightly under the outside margins of each. I've tried EVERYTHING I can think of to align these babies, and nothing has worked (although my attempts did produce some pretty unusual results). Here's my code:

    CSS:

    div {
    color: #cc99ff;
    text-decoration: none;
    }

    P {
    font-family: papyrus; arial; serif;
    color: #cc99ff;
    font-size: 12pt;
    text-decoration: none;
    }

    HTML:

    <table width="100%">
    <tr width="100%">
    <td width="48%">
    <div class="float" align="right">
    <a href="C:\Documents and Settings\Ashley Stearns\My Documents\virtualashley.html"><img src="C:\Documents and Settings\Ashley Stearns\My Documents\homephotoshop.gif" width="51" height="51"></img src></span>
    <p style="margin-left:228px; margin-right:auto;">Home</p></a>
    </td>
    </div>
    <td width="4%">
    </td>
    <td width="48%">
    <div class="float" align="left">
    <a href="mailto:ashleystearns@attbi.com"><img src="C:\Documents and Settings\Ashley Stearns\My Documents\writeus.gif" width="51" height="51" alt="E-mail"></img src></span>
    <p style="margin-left:auto; margin-right:228px;">Email</p></a>
    </td>
    </tr>
    </div>
    </table>

    Also, I STILL have the rectangular box around them, even though I saved them (in Photoshop) for the web, as a dithered gif with a transparent background (which worked).

    And, MOST IMPORTANTLY, even if I cannot find help with the above issues, could someone please tell me how I make the text in my unordered list components aligned fully (it used to be called "justify," but that attribute, for some odd reason, is deprecated).

    Thank you all.

  2. #2
    .net install meltdown
    Join Date
    May 2001
    Location
    View Ridge
    Posts
    692
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If I'm following you, for the images try this:

    img {border:0}

    And for the list:

    ul {text-align:justify}

    I'm not sure about browser support for text-align:justify though.

    HTH

  3. #3
    SitePoint Enthusiast
    Join Date
    Mar 2002
    Posts
    70
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile Thank you!

    I fell asleep last night wondering why, for the love of G_d and all things holy, I didn't think about using a border and padding for my gif positioning. I R slow, I guess.

    I'll try the ul suggestion, too. Thanks.


  4. #4
    SitePoint Enthusiast
    Join Date
    Mar 2002
    Posts
    70
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Talking I did it!

    Here is what I ended up with:

    CSS:

    div.float {
    float: center;
    }

    div.float p {
    text-align: center;
    }

    HTML:

    <table>
    <tr width="100%">
    <link rel="stylesheet" type="text/css" title="navstyles" href="navstyles.css" />
    <td width="40%">
    </td>
    <td>
    <td width="10%">
    <div class="float" align="center">
    <a href="C:\Documents and Settings\Ashley Stearns\My Documents\virtualashley.html"><img src="C:\Documents and Settings\Ashley Stearns\My Documents\homephotoshop.gif" width="51" height="51"></img src></span>
    <p align="center">Home</p></a>
    </td>
    <td width="10%">
    </div>
    <div class="float" align="center">
    <a href="mailto:ashleystearns@attbi.com"><img src="C:\Documents and Settings\Ashley Stearns\My Documents\writeus.gif" width="51" height="51" alt="E-mail"></img src></span>
    <p align="center">Email</p></a>
    </div>
    </td>
    <td width="40%">
    </td>
    </tr>
    </table>

    So now I have my two navigational gifs centered, side-by-side, at the bottom of each of my pages, with their labels centered underneath each of them.

    Yippee-skippee!


Bookmarks

Posting Permissions

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