Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jun 2009
    Thanked 0 Times in 0 Posts

    floated image outsive of div

    Hi guys, noob question, but when I saw this it broke some of the rules I thought I had known.

    I want to float my image to the right and have paragraph text wrap around it. I do not know why the image is outside of my #main div with the gray background and darkblue border, but I don't want it to be. Relative code below.


    <div id="main">
    <h2> About myself <h2>

    <img src="img/aboutme/me.jpg" style="position: relative; float: right">



    *I don't think position: relative is necessary, but not having it doesn't change anything.

    #main {
    position: relative;
    top: -20px;
    background: #EAF3F8;
    border: 20px #153e56 solid;
    margin: 0px 50px;
    width: 60%;


    Thanks all

  2. #2
    Senior Coder
    Join Date
    Feb 2009
    Ilkley, West Yorkshire, UK
    Thanked 727 Times in 721 Posts
    It's because the <img> is floated, so #main doesn't extend to the bottom of it (although it does in IE, technically incorrectly). Try adding overflow:auto to #main - this will clear your float and extend #main.


Posting Permissions

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