Forums

rooibos

Hi there, I'm new in this forum and I've to say I don't know speak english so much, so I'm sorry and I'll try to explain me correctly.
My problem appear when I'm trying to do boxes who grow up vertically and it has 2 informations columns.
This box has an aspect like #24: Rounded Corners video by Chris Coyer on this web.
My HTMLs code:

    <div id=\"wrapper\">
    
    	<div class=\"top\"></div>
    	<div class=\"middle\">
    	<div class=\"wrapper-info\">
        
            <div style=\"float:left; width:590px;\">
                <div id=\"migastexto\">
                	<p>trabajos > 3d > infoarquitectura</p>
                </div>
                <span id=\"cabezamigas\"></span>
            </div>
            
            <h1>Presentación:</h1>
            <p>Bienvenid@.</p>
            <div id=\"column1\"><p>Columna 1.Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p></div>
                                    
            <div id=\"column2\"><p>Columna 2.Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p></div>
            </div>
		</div><!--end wrapper info -->
<div class=\"bottom\"></div>
</div> <!--end wrapper  -->

CSS code:

/*contenido principal
------------------------------------------------------------------------------------*/

.top{
	background: transparent url(../imagenes/arriba.png) no-repeat top;
	float:left;
	width:600px;
	height:16px;
	}
.bottom{
	width: 600px;
	height:67px;
	background: transparent url(../imagenes/pie/portadapiefin.png) no-repeat;
	float:left;
	}
.middle{
	background-color:#d7e5b6;
	border-left:3px solid #FFF;
	border-right:3px solid #FFF;
	width:594px;
	xpadding:0;
	float:left;
	}
.wrapper-info{
	width:600px;
	float:left;
	padding-bottom:15px;
	}

	
	
#column1 {float:left; width:250px;}
#column2 {float:left; width:250px;}

OK, i don't know how can i do this box with two informations columns, being this information something like pics, texts etc.

IS correct this method I'm using to do box?

Thanks a lot and I'm sorry my english. (I'm from Canary Islands, Spain).

treehouse : what would you like to learn today?

Forums

box with 2 columns growing up vertically