SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    Non-Member
    Join Date
    Mar 2013
    Location
    Sydney
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    floating div css code need.

    Hello friends,
    I need your help for add a floating div in my website, so guys please help me and suggest me css code for a floating div.
    Thanks.

  2. #2
    SitePoint Mentor bronze trophy
    John_Betong's Avatar
    Join Date
    Aug 2005
    Location
    City of Angels
    Posts
    1,840
    Mentioned
    73 Post(s)
    Tagged
    6 Thread(s)
    Try this:

    PHP Code:

    /* CSS Start  */ 


    div {width:200pxheight:200pxborder:dotted 1px #f00; background-color:#ff0}

    .fll {float:left}
    .
    flr {float:right}

    .
    clb {clear:both}
    .
    clr {clear:right}
    .
    cll {clear:left}

    /* CSS finsih  */ 

    <h2>test start</h2>

    <
    div class='fll'>
      
    testing float
    </div>

    <
    div class='flr'>
      
    testing float
    </div>

    <
    h2 class='clb'>test start</h2
    Last edited by John_Betong; Mar 30, 2013 at 09:28. Reason: spelling: not my fortay
    Learn how to be ready for The New Move to Discourse

    How to make Make Money Now with a *NEW* look

    Be sure to congratulate Patche on earning Member of the Month for July 2014

  3. #3
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,208
    Mentioned
    456 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by noahwilson View Post
    I need your help for add a floating div in my website, so guys please help me and suggest me css code for a floating div.
    John has given you a detailed example, but in brief, you need to set a width for the div less that 100% and give it float: left or float: right. E.g.

    Code:
    div {float: left; width: 400px;}


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
  •