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

    display:inline-block;

    I'm trying to get three divs to position properly. I have div a on the left and div b,c on the right. Here's my coding so far
    CSS

    #content {width:1024px;
    height:800px;}

    .a { display:inline-block;
    vertical-align:top;
    width:510px;
    height:800px;}

    .b { display:inline-block;
    vertical-align:top;
    width:510px;
    height:400px;}

    .c { display:inline-block;
    vertical-align:top;
    width:510px;
    height:400px;}


    When I used my browser div c didn't go under b and instead stays under a, how do I fix this?

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,642
    Thanks
    6
    Thanked 1,005 Times in 978 Posts
    With your CSS you tell the browser that all these divs should go on one line and wrap to the next line if there is not enough space. That means div c will go on the next line just as a word in a paragraph would go on the next line. What is your intention here? Do you want to have a two-column layout?

  • #3
    New to the CF scene
    Join Date
    Apr 2014
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts
    display:inline-block;-example.png and yes a two column layout is my goal.


  •  

    Tags for this Thread

    Posting Permissions

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