Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
  1. #1
    Junior Member
    Join Date
    Feb 2010
    Posts
    8
    Member #
    21289
    Hi, could someone please tell me why the floated image in the sidebar of my home page is not behaving properly? It is suppose to float to the left with the text on the right and the background go all around. I'm at a loss.

    http://nutritiononrequest.com/test.html

    thanks!

  2.  

  3. #2
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    oops ... I gave the wrong answer ... will reply again with a better example.


  4. #3
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    Here is an example of what I might do to it.
    I put the CSS in the index page, just for the example. You would move it to your CSS file.

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link href="main.css" rel="stylesheet" type="text/css"/>
    <title>NoR_home</title>
    <style type="text/css">
    <!--
    #sideBar .st .sb{
    	float: left;
    	margin: 10px;
    }
    #fruitpic{
    width:100%;
    height:100px;
    border-top:5px solid #ff9c00;
    }
    #fruitpic img{
    float:left;
    padding:5px 15px 0px 5px;
    }
    #fruitpic p{
    float:left;
    padding:5px 0px 0px 0px;
    font-family:arial;
    font-size:14px;
    line-height:18px;
    color:#fff;
    text-align:left;
    }
    -->
    </style>
    </head>
    
    <body>
    
    <div class="st"><div class="sb">
    
    <div id="fruitpic"><img src="images/mangoe.png" width="100" height="88" />
              <p>Highlighted <br />
              Fruit or <br />
              Vegetable<br />
              <br />
              </p>
    </div>
              
    </div> <!--stsb-->
    </div> <!--sideBar-->
    
    
    </body>
    </html>


  5. #4
    Senior Member aeroweb99's Avatar
    Join Date
    Feb 2008
    Location
    Port Huron, Michigan
    Posts
    1,037
    Member #
    16468
    Liked
    1 times
    Where is the sidebar div?

    EDIT>>> Nevermind, this one is confusing me, although I think I helped him with the big box on the right a while back. :ermm:

  6. #5
    Junior Member
    Join Date
    Feb 2010
    Posts
    8
    Member #
    21289
    thanks for the help, mlseim. I tried that out but what I ended up with was the image and then the text stacking below it. I worked with it some more and figured out it had something to do with my padding.

    aeroweb99, yes you helped me a little while back and I really appreciated it. This is my first css website and technically my first real website so I'm sure things are bound to look odd. All the process of learning right And not that you would know.... but I'm a she, not a he.

  7. #6
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    Show us the site now ... with the new changes. We're curious to see it.



Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 10:58 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com