View Poll Results: Do you code your own HTML and CSS?

Voters
5. You may not vote on this poll
  • Yes.

    5 100.00%
  • Yes (HTML) and no (CSS).

    0 0%
  • No (HTML) and yes (CSS).

    0 0%
  • No.

    0 0%
Results 1 to 1 of 1

Thread: Trying to arrange or float HTML "div" blocks; please help! (Hopefully an easy fix.)

  1. #1
    Join Date
    Jul 2006
    Location
    Southeastern USA
    Beans
    242
    Distro
    Ubuntu 12.04 Precise Pangolin

    Smile Trying to arrange or float HTML "div" blocks; please help! (Hopefully an easy fix.)

    The problem I'm having can be seen with my reading list at the very top: I wish to
    • float the banner on the left
    • have the webpage "menu" links on the right
    • have the horizontal rule underneath it all, to clearly divide the "menu bar" from the webpages that load it (via SSI, which I've been told is better than using frames that break with search engines)


    The page source is public; the relevant bit seems to be:
    HTML Code:
    <style type="text/css">
       oops {text-decoration:line-through;}
       .sub {list-style-type:upper-roman; content:counters(li+1);}
       body {text-align:left}
       blockquote {background-color: white}
       .bib {color: green}
      </style>
    </head>
    
    <body>
     <div>
      <div style="float:left">
       <a href="http://www.realhealthcarerespectslife.com/">
        <img alt="realhealthcarerespectslife.com" src="../img/prolife/banner-KeepAbortionOut_460x81.jpg" width="460" height="81">
    
       </a>
      </div>
      <div>
       <ul class="nav">
        <li><a href="contact.shtml">Contact <abbr title="Information">Info.</abbr></a></li>
        <li><a href="faithexcerpts.shtml">Faith Excerpts</a></li>
        <li><a href="fortcook.shtml">Fortune Cookies</a></li>
    
        <li><a href="links.shtml">Links</a></li>
        <li><a href="catholicquestions.shtml">Questions Concerning Christianity</a></li>
        <li><a href="quot.shtml">Quotations</a></li>
        <li><a href="perf.shtml">Past Performances</a></li>
        <li><a href="profile.shtml">Profile</a></li>
        <li><a href="books.shtml">My Reading List</a></li>
    
        <li class="last"><a href="../index.shtml">Home</a></li>
       </ul>
      </div>
      <hr>
    </div>
    I have noticed that, if the text is large enough, the horizontal rule is bumped down to divide the entire thing, as desired. But when the text is smaller, I have the problem I mentioned: the horizontal rule goes after the text but only covers half the screen, stopping beside (rather than beneath) the image.
    Any help you can give me would be greatly appreciated! Thank you for your time.
    Last edited by newagelink; December 9th, 2009 at 12:30 AM. Reason: added detail

Tags for this Thread

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
  •