Envoltura de cambio de tamaño

Having an issue resizing the #main_wrap on:

http://www.coffeeproteindrink.com/method-athlete/

#main_wrap {
min-height: 100%;
background: url(images/content_back.png) repeat-y top left; 
margin: 0 0 0 240px;
opacity: .8;
}

#content
{float: left;
margin: -28px 0 30px 0;
position: relative;
z-index: 20;
top: 325px; 
height: 262px;
overflow: scroll;
}

I am trying to get it to look like:

http://www.bio-genix.com/

I am sure I am just having a brain fart, but I just can't seem to get this to work.

Cualquier ayuda es muy apreciada.

Conocido

preguntado el 30 de junio de 12 a las 21:06

Welcome! Please reduce your source markup and CSS to that which you think is causing/underlying your problem and include in the question body. Use the {} button after highlighting code to format it in your text. :) And/or make a jsfiddle.net manifestación. -

If you don't even allow us to right-click your page (what a barbaric thing to do! absolutely awful. you have crushed me), there's little we could do to help you :) -

That 'no right click' is built into this theme, I disabled it, sorry about that. -

You need to better describe the problem itself. Do you not want the scrollbars to appear? Also, floating tu #content container... -

Also, just some advice, look and see if Google Web Fonts has a font you can use. Cufon is bleh. -

2 Respuestas

Tus top: 325px value is on #content, which is further down than where you want to be in element list. Hence, you want to push down #main_wrap con topy quitar el top en #content.

#main_wrap {
    position: absolute; 
    top: 325px;
} 
#content {
    top: 0;
}

http://jfcoder.com/test/methodsite.html

Respondido el 30 de junio de 12 a las 22:06

Thanks Again Jared, As soon as I have enough rep I will be sure to mark this up. - Conocido

Yeah, I forget all the arcane vote and comment and whatnot rules SO has. You're welcome, glad I could help. And thank you for marking returning to mark the answer; that's appreciated, believe me. :) - Jared Farrish

One simple thing to do is (if having access to CSS) go down to your #Content tag

#content {
float: left;
margin: -28px 0 30px 0;
position: relative;
z-index: 20;
top: 325px;
height: 262px;
overflow: scroll;
}

And remove overflow:scroll, as your content divider is large enough to handle the content without having to overflow. So it should look like this

#content {
float: left;
margin: -28px 0 30px 0;
position: relative;
z-index: 20;
top: 325px;
height: 262px;
}

Respondido el 30 de junio de 12 a las 21:06

I want the scroll bars there, as I want to keep the wrapper to about 40% of the page height. Like it is on bio-genix.com Some pages will have more content than others and the scroll bars will be needed. - Conocido

So do you mean, you want it to scroll, but not have them be there? I see they dynamically placed their wrappers. EDIT: Try overflow:hidden; - liam stanley

The problem was the black transparent background going up to the top of the viewport, not the scrollbars. - Jared Farrish

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.