Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] 100% width DIV into 3 DIVS

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #189894
    mika
    Participant

    Hi folks,

    i need some help with my site. I need to make DIV (100%) and inside that there are 3 DIVS where left and right DIVs are width 32px and center DIV should stretch between these two with background color.. how can i make center div work right?

    // Mika

    #189895
    Paulie_D
    Member
    #189897
    Shikkediel
    Participant

    Nicely done, taught me something new about CSS.

    #189906
    mika
    Participant

    Thx Paulie,

    I did it like this. Look my demosite testi4.aada.fi and those “kinky” corners in sections.

    #MAIN { 
            display: table; 
            float: left; 
            height: 32px; 
            width: 100%; 
            margin-top: 19px; 
            } 
            
    #LEFT { 
            display: table-cell; 
            float: left; 
            width: 34px; 
            height: 32px; 
            background-image: url("/packages/bootstrap/themes/bootstrap/images/uutiset_ala_vasen.png"); 
            background-repeat: no-repeat; 
            background-position: left bottom; 
            } 
            
    #CENTER { 
            display: table-cell; 
            height:32px; 
            background-color: #fed100; 
            background-image: url("/packages/bootstrap/themes/bootstrap/images/uutiset_keski_bg.png"); 
            background-repeat: repeat; 
            float: none; 
            box-sizing: border-box; 
            width: 100%; 
    }         
            
    #RIGHT { 
            display: table-cell; 
            float: right; 
            width: 34px; 
            height:32px; 
            background: url("/packages/bootstrap/themes/bootstrap/images/uutiset_ala_oikea.png"); 
            background-repeat: no-repeat; 
            background-position: left bottom; 
            } 
Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.