PDA

View Full Version : how to define the variable bottom of centered wrapper


BluiSh
09-21-2011, 11:31 PM
Hello

I have a web page with a wrapper centered with all my info and in fact this is the main body of my site, the problem that I have is that Id like to set and adjust the bottom of the wrapper automatically in order to fit on every screen resolution that the users have in Internet.

I have try the auto option in the top and bottom of the dialog box of the css rule but nothing. anyone could help me or know something about it???

Thanks
BluiSh

edbr
09-22-2011, 02:01 AM
you mean centred top and bottom?

BluiSh
09-28-2011, 08:41 PM
I mean not centred but instead how to define all the way from the top to the bottom???

the sizes of the screens are many, so which is the best way to go??? I have centred my wrapper but with the bottom is a problem because I have a background image and I have to display it all the way down to the bottom, this is where my problems begins.

Thanks edbr for your help
Bluish

Corrosive
09-29-2011, 06:33 AM
Your wrapper should stretch automatically if you don't define a height. We'd need to see this online to help further.

BluiSh
09-29-2011, 05:13 PM
How can I show you what Id like??? I don't have it online yet, maybe I could show you some example of one site of my preference??? or you could tell me some site where to go???

I already put some height but if I define a value for the height when I have a bigger screen or smaller screen is not looking right and not fitting well.

Thanks I really appreciated your attention and help

domedia
09-30-2011, 01:05 PM
What Corrosive means is that in order to help with your page specifically, we need to see it. Not a picture of it, but an example of it uploaded somewhere to the web. If you can upload it to a temporary location just so we can review the page in the browser, it would help a lot.

BluiSh
10-03-2011, 06:24 PM
I have one place already for this task! let me upload everything and I could tell you with a message where it is to check it personally??? That would be so helpful domedia or corrosive...

Thanks

domedia
10-04-2011, 03:09 AM
I can completely understand hesitating about putting things in progress online.

Try This:

1. Upload the site to a temporary location on the web.
2. Use a short url service like http://www.shorturl.com/ to 'hide' the link.
3. Post the short url in a post in this thread
4. A soon as you're satisfied, remove the temporary files from the server and the shorturl will not longer work.

BluiSh
10-05-2011, 03:36 PM
Dear domedia

I have already uploaded my website in the following link:

http://www.betzgames.com

Id really appreciate your help with this issue, as you can see in the bottom of the webpage there is a little space that is not going all the way to the bottom, also you can see that I have a background image that maybe if a repeat it could go to the bottom also but I need in some way define automatically the size of the wrapper according the size and resolution of every screen.

Looking forward to hear from you pretty soon.
Thanks again

Sincerely
Bluish

ps: like a plus I would really like to hear what do you think of the site or if you think that something has to be changed???

domedia
10-06-2011, 01:23 PM
The web site look fine to me, I see no issues with the bottom area.

Did you fix it?

BluiSh
10-06-2011, 01:36 PM
I havent made any changes, Maybe you are looking with just one browser but try with firefox or chrome or safari and you are going to see some space is missing in the bottom, that's what Id like to fix, how to make the display all the way down to the bottom automatically.

Thanks domedia and of course the site is not finished yet :)

BluiSh

Corrosive
10-06-2011, 02:10 PM
I don't think it can be done. Containers will stretch to fit content unless you give them a specific height.

gentleone
10-06-2011, 02:48 PM
This will do the trick, but don't set a border and/or padding on the wrapper div.


html, body {
margin: 0;
padding: 0;
height: 100%;
}

#wrapper {
position: relative;
min-height: 100%;
width: 960px;
margin: 0 auto;
padding: 0;
background-color: #CCC; /* just for testing purpose */
}

* html #wrapper {height: 100%} /* for the old IE if you need it */

BluiSh
10-08-2011, 05:44 PM
Thank you very much gentleone Im testing the code and everything Ill let you know what happened...

Thanks

BluiSh
10-08-2011, 05:46 PM
And Thank you very much all of you for showing this kind of support, I feel really well for all the information and to be in a very good forum like this.

Thanks again
BluiSh

gentleone
10-09-2011, 12:33 PM
Thank you very much gentleone Im testing the code and everything Ill let you know what happened...

Thanks
Your welcome, BluiSh ;)

I want to add that with no borders and padding I meant no top/bottom borders and top/bottom padding. Left/right for both is okay and won't break the layout. If you want to have space at the top give the first child a top margin.

Sareyyy
03-23-2012, 08:57 PM
Hi, I am having similar problems. I centered all my content in a wrapper, set the box width to my site width and the height to auto, but when I preview in the browser, I lose the bottom half of my site and it won't let me scroll down! Please help!
Thanks

edbr
03-23-2012, 11:44 PM
same thing we need to see what you have done to answer this