#1
  1. No Profile Picture
    Contributing User
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Jan 2004
    Location
    Budapest
    Posts
    1,703
    Rep Power
    67

    <p> Float Woes...


    I have a div with ID service_div. Inside this div I have an image that I have set to float:left;. Following the image and inside the div service_div I have a paragraph, which I want to float by the picture.

    For some reason the <p> falls under the picture instead of alongside it. I don't know if this is some inheriticance issue but would really appreciate it if someone could be of some help.

    Click Here


    Code:
    #content div#service_div{
    margin:0 0 15px 0;
    padding:20px 30px 0 16px;
    font-size:14px;
    line-height:1.5;
    text-align:justify;
    line-height:1.5;
    }
    #content div#service_div img{
    float:left !important;
    margin:5px 10px 0 0;
    }
    #content div#service_div p{
    padding:0;
    margin:0;
    text-align:left;
    float:left !important;
    position:relative;
    }
    Today the world, tomorrow the universe...
  2. #2
  3. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2011
    Location
    The Pleiades
    Posts
    299
    Rep Power
    9
    Hello there. I had a looks using firebug and it seems you need to take the float: left !important off your <p> style.

    Here is the code to delete in red:
    Code:
    #content div#service_div p{
    padding:0;
    margin:0;
    text-align:left;
    float:left !important;
    position:relative;
    }
    Hope this helps you.

    Kind regards,

    NM.
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Jan 2004
    Location
    Budapest
    Posts
    1,703
    Rep Power
    67
    THANK YOU! It worked. ;-) The people needs more helpful people like you. ;-)
    Today the world, tomorrow the universe...
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Jan 2004
    Location
    Budapest
    Posts
    1,703
    Rep Power
    67
    Any idea why that does not work in IE?

    Originally Posted by Nanomech
    Hello there. I had a looks using firebug and it seems you need to take the float: left !important off your <p> style.

    Here is the code to delete in red:
    Code:
    #content div#service_div p{
    padding:0;
    margin:0;
    text-align:left;
    float:left !important;
    position:relative;
    }
    Hope this helps you.

    Kind regards,

    NM.
    Today the world, tomorrow the universe...
  8. #5
  9. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2011
    Location
    The Pleiades
    Posts
    299
    Rep Power
    9
    Which version of IE because I just checked it in IE8 and it works identical to any other browser.

    The way I usually would do this is to put the image inside the p tag and pretty much use the same styles as you have already got. Just edited your code and tested it and it products the same exact result in all browsers again.

    Kind regards,

    NM.
  10. #6
  11. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2012
    Location
    On planet earth
    Posts
    101
    Rep Power
    10
    Originally Posted by Nanomech
    Which version of IE because I just checked it in IE8 and it works identical to any other browser.

    The way I usually would do this is to put the image inside the p tag and pretty much use the same styles as you have already got. Just edited your code and tested it and it products the same exact result in all browsers again.

    Kind regards,

    NM.
    According to another thread thall89553 made, thall89553 is using IE7

IMN logo majestic logo threadwatch logo seochat tools logo