1. Computer problem? Tech Support Guy is completely free -- paid for by advertisers and donations. Click here to join today! If you're new to Tech Support Guy, we highly recommend that you visit our Guide for New Members.

HTML help, please!

Discussion in 'Web & Email' started by Nando, Feb 6, 2003.

Thread Status:
Not open for further replies.
Advertisement
  1. Nando

    Nando Thread Starter

    Joined:
    Nov 19, 2001
    Messages:
    239
    Hi,
    I want some HTML help.
    I have this pre-build design in my personal site, check it here:
    http://209.51.138.218/~nando/blog/

    Ok:

    1 - I want to make a column on the right, just like the one in the left, leaving the the big column in the middle.

    2 - I want the links to have some kind of efects when I put the mouse on it. Maybe a darker color in bold... This is CSS, right? I know noting about CSS.

    Please help! ;)
     
  2. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
    we'll get you started with the mouse effects.

    Yep you will want to use css.

    here is what you need. specifically the hover one. When you hover over a link, you can define what colors you want to display.

    PHP:
    <style type="text/css">
    :
    hover {color#ff0000; background-color:transparent }
    :link color#ff0000; background-color:transparent}
    :visited color#ff0000; background-color:transparent }
    :active {color#ff0000; background-color:transparent }
    </style>
    That will apply to all links on the page unless they are overridden.

    Just change the color and background color to what you want. Link defines the color of an unvisited link. Visited is obvious. Active is when you actually click on the link. Hover is when you hover over the link.

    now if you need to define a second set of link attributes you would add the following to the above

    PHP:
    a.c2:hover {color#ff0000; background-color:transparent }
    a.c2:link color#ff0000; background-color:transparent}
    a.c2:visited color#ff0000; background-color:transparent }
    a.c2:active {color#ff0000; background-color:transparent }
    then if you have a link that you want to use the second set of colors, you do it like this

    PHP:
    <a href="http://www.google.com" class="c2">Google</a>
    you can view source of my page http://home.tbbs.net/shadow/mod.htm for an example
     
  3. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
    now to add a right panel, you want to stick with tables.

    basically what you need to do is add a cell, change the colspans to span across the new cell. and widen the table to accomodate the new cell.

    this will get you started

    PHP:
    <td>test</td>
    now here is where I added that.

    PHP:
    <CLASS=left>

    </
    TD><td>test</td>


    <
    TR>
    <
    TD bgcolor="#003366" COLSPAN="2">
    <!-- 
    begin footer -->
    I added it right after the td close tag.
    which is the tag that is closing the middle section. so you have to view your code and scroll down to just above where you put the footer in. Just remember, you will have to resize the tables and change the colspans to 3.

    Just keep in mind, you will either have to shrink the size of the middle section or extend the table width off the page. (the page will then scroll left to right. Plus you will have to set the width of the new cell.

    but now that you know where to put it, all you have to do is tweak the settings.
     
  4. Nando

    Nando Thread Starter

    Joined:
    Nov 19, 2001
    Messages:
    239
    Thanks man!

    I'll have to study that a little bit! ;)
     
  5. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
  6. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
    attached is a text file with the changes I made to get it like it is at

    http://home.tbbs.net/shadow/tsgforums/blog/blog.htm


    attributes that I changed are encased in exclamation points.

    e.g.

    !!!!!attribute!!!!!

    then you can use that info to tweak it.

    keep in mind, I use 1024 x 768 screen resolution. (it all fits on the screen for me, but not sure if it will at other resolutions, but that's why I changed the width sizes to percentages.

    ps. it looks pretty good maximized, but minimized the new column is not sized right.

    Tweak away. Good luck
     

    Attached Files:

  7. Nando

    Nando Thread Starter

    Joined:
    Nov 19, 2001
    Messages:
    239
    Thanks! It really helped! ;)
     
  8. Nando

    Nando Thread Starter

    Joined:
    Nov 19, 2001
    Messages:
    239
  9. Nando

    Nando Thread Starter

    Joined:
    Nov 19, 2001
    Messages:
    239
    I want a 90% main table.

    And maybe a 50% middle table and 20% each side tables. Do you understand what I mean?
     
  10. Nando

    Nando Thread Starter

    Joined:
    Nov 19, 2001
    Messages:
    239
    ok, forget about it. I've solved it. Thanks anyway.
     
  11. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
    take a look at this http://home.tbbs.net/shadow/tsgforums/blog/blog2.htm

    you forgot to change the colspans to 3. That's why the blue parts didn't go over all the way.

    Now you said that you wanted a 90% table.

    with a 20% 50% 20% cells.

    in the above link I set it to 20% 60% 20%. which equals 100%.

    when you set the table to a width percentage, that width is the percentage of the screen. now when you set the width of a cell, that's the percentage of the table.

    so you want the table to fill the screen 90%. Then you want the 3 cells to split 100% of the table. 20 + 60 + 20 = 100.

    so your 3 cells should take up 100% of 90% of the screen. (not forgetting about cellpadding, borders and spacing of course)

    I know that sounds weird, but just making a point that you can have the middle be 60 instead of 50 and still have the sides be 20.

    now in this new link it is set up right for maximized, but it's not right when minimized because of the use of a percentage instead of a fixed width.

    yet.


    one thing. like I said before, as long as the window is maximize, it should look great in all browsers, but when minimized the widths go all funky. The page needs a fixed width and really needs to be built from scratch.

    Sometimes it's easier to knock down a building and build a new one than repair an existing one.

    but you should do fine, for now.
     
  12. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
    if you cannot get it to work right, here is a template that you can use if you want.


    http://home.tbbs.net/shadow/tsgforums/blog/blog3.htm

    It will display perfect in everything, but Opera 7.00 Final and Netscapte 4.8. both of them don't make the right column wide enough.

    In everything else, it looks perfect; even when minimized.

    It is also html and css compliant.

    http://validator.w3.org

    Ok. done playing with tables for a while.


    :cool:
     
  13. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
  14. Sponsor

As Seen On
As Seen On...

Welcome to Tech Support Guy!

Are you looking for the solution to your computer problem? Join our site today to ask your question. This site is completely free -- paid for by advertisers and donations.

If you're not already familiar with forums, watch our Welcome Guide to get started.

Join over 733,556 other people just like you!

Loading...
Thread Status:
Not open for further replies.

Short URL to this thread: https://techguy.org/117323

  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice