SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Enthusiast
    Join Date
    Jun 2004
    Location
    Cincinnati, OH
    Posts
    94
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile Problems With My Headlines

    Suddenly I'm having problems with my headlines...

    1. For some reason, the headlines take a long time to load. I see this in my FrontPage2000 Preview and online. Even when I refresh, the graphic appears instantly but the headline takes a while to appear. This wasn't the case before and I'm not sure what is causing it.

    2. I now have a greater space (I believe printers call this leading) between the 2nd line & 3rd line of my H1. It's the space just above the line that starts out "Online - ..."

    3. My H2 headline only partially appears (it seems to vary each time) and sometimes the letters in a line appear squashed together vertically.

    The URL if you'd like to look is www.Visitors2Customers.com

    Here's the HTML...

    <h1 align="center"><b><span style="mso-tab-count: 1"><font color="#000080" face="Tahoma" size="5">&quot;Top Internet Marketing Consultant
    Reveals<br>
    &nbsp;How You Can </font><font face="Tahoma" size="5" color="#007B00">Sell
    More Products </font><font color="#000080" face="Tahoma" size="5"> and
    </font><font face="Tahoma" size="5" color="#007B00"> Services</font><br>
    <font color="#000080" face="Tahoma" size="5">Online</font><font face="Tahoma" size="5" color="#006600">
    </font><font color="#000080" face="Tahoma" size="5"> </font> <font face="Tahoma" size="5" color="#007B00">Faster,
    Easier</font> <font color="#000080" face="Tahoma" size="5">and</font><font face="Tahoma" size="5" color="#006600">
    </font><font face="Tahoma" size="5" color="#007B00">
    More Profitably</font><font face="Tahoma" size="5" color="#006600">
    <br>
    </font><font color="#000080" face="Tahoma" size="5">Than
    You Ever Could Have Imagined?&quot;</font></span></b></h1>

    <h2 align="center" style="text-indent: 12"><b><font face="Tahoma" size="4" color="#000080">&quot;Your Internet
    and Website </font><font face="Tahoma" size="4" color="#007B00"> Marketing Doesn't<br>
    Have To Be A Struggle</font><font face="Tahoma" size="4" color="#000080">, Here's Where You Can Learn<br>
    How To </font><font face="Tahoma" size="4" color="#007B00"> Get All The Business You Can Handle</font><font face="Tahoma" size="4" color="#000080"> ...&quot;</font></b></h2>

    Thanks in advance for your help and since my HTML knowledge is only moderate, I'd really appreciate it if you can give me the for "Dummy's" version of the solution. :-)

  2. #2
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,240
    Mentioned
    194 Post(s)
    Tagged
    2 Thread(s)

    explanation: "Dummy's" version

    What you are seeing is a result of using break tags in the heading tag and the browser's handling of word-wrap. Change your browser to a text size small enough, and only the break tag will force a newline. However, you have no control over your users' text size and/or screen resolution. I would suggest putting each line in it's own heading tag and lose the break tags.

  3. #3
    SitePoint Enthusiast
    Join Date
    Jun 2004
    Location
    Cincinnati, OH
    Posts
    94
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks. I appreciate your help. I wonder why this is happening all of a sudden. The headlines been the same for a while now. However, the side panels being a different color (they were white with no border) is new. Also, any thoughts on the other parts of my post?

  4. #4
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,240
    Mentioned
    194 Post(s)
    Tagged
    2 Thread(s)

    Site layout

    I notice the right side "linkList" takes up quite a bit of real estate unecessarily. I would run your page through the w3c validator and clean up what you can. It will help with cross-browser compatibility. http://validator.w3.org/check?uri=+w...2Customers.com

  5. #5
    SitePoint Enthusiast
    Join Date
    Jun 2004
    Location
    Cincinnati, OH
    Posts
    94
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for your reply. Could you explain how it is taking up real estate unnecessarily?

  6. #6
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,240
    Mentioned
    194 Post(s)
    Tagged
    2 Thread(s)

    screen real estate

    The #linkList { background:#f0ffff; padding:10px; }
    is in a td id="column2" width="15" (which doesn't look correct, seems to be improper table structure, hence my validate suggestion) that takes up the width of 15 for nearly the entire page, long after it runs out of content. This forces the body's main text into the area that remains to the left. Once you clean up the page a bit, try "floating" it (the linkList).

  7. #7
    SitePoint Enthusiast
    Join Date
    Jun 2004
    Location
    Cincinnati, OH
    Posts
    94
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for your help. I do appreciate it.

    While I'm sure I understand HTML better than the average bear I still don't understand much of what you're saying. That's not your fault, it's mine. However, if you could not assume that I know anything (and you wouldn't be far from wrong ;-) ), it would help me grasp this better.

    I went to validator but really didn't understand it either. I was just totall lost regarding how to use it to help me. Apparently I've got lots of problems but I'm not clear on what they are. Thanks for pointing this problem out to me.

    Regarding your comments, if you're referring to the link list on the right side of the page as running all the way down to the bottom of the page (taking up a lot of real estate), that was by design. I thought it looked better continuing the panel to the end of the page rather than just stopping it midway through. And I wanted all the basic content "forced" into the main panel. Is there anything wrong with doing it this way?

    >>The #linkList { background:#f0ffff; padding:10px; }
    is in a td id="column2" width="15" (which doesn't look correct, seems to be improper table structure, ..."The #linkList { background:#f0ffff; padding:10px; }
    is in a td id="column2" width="15" (which doesn't look correct, seems to be improper table structure, <<

    In the above, what doesn't look correct, the panel going all the way to the bottom, or something else? Why would it be improper table structure? I'm also not sure what you mean by "floating" the link list.

    You mentioned previously that the break in the headlines might be a problem. I know I'm missing something so maybe you can help me understand. Since I have a container and I'm well below the smallest size width (700px) it seems like my headline should work on any computer screen, what am I missing?

    Someone designed the basic structure of this based on my request (although I may be the one who's messed it up). Here's something else I don't understand, I thought the purpose of CSS was to avoid tables, yet this has a table? Should it?

    Thanks again for your help and patience.

  8. #8
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,240
    Mentioned
    194 Post(s)
    Tagged
    2 Thread(s)

    problems

    Quote Originally Posted by ealvin
    ... I thought it looked better ... Is there anything wrong with doing it this way? ...
    Not at all, just my personal style taste.
    Proper table structure is basic HTML eg.
    HTML Code:
    <table>
      <tr>
        <td>
        cell content
        </td>
        <td>
        cell content
        </td>
      </tr>
      <tr>
        <td>
        cell content
        </td>
        <td>
        cell content
        </td>
      </tr>
    </table>
    It does not look similar to that. By "floating" I meant a css style. eg.
    Code:
    #topLeftImage { float: left;}
    As to the break tags in the heading tags, the page now has
    HTML Code:
    <h3>text.. text.. text.. <br>text.. text.. text.. <br>text.. text.. text.. </h3>
    Try changing to
    HTML Code:
    <h3>text.. text.. text.. </h3>
    <h3>text.. text.. text.. </h3>
    <h3>text.. text.. text.. </h3>
    New headings start on new lines (they're block elements)


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
  •