I think it's the min width that's messing it up. Deena
2009/12/11 Ronald Kyamagero <[email protected]> > I see, > > thanks > > However, when I use 100% on the outer div and a fixed width for the inner > width on the code you sent me, it works. How come it does not work on mine? > > Thanks again, > > Ronald > > 2009/12/11 Ghodmode <[email protected]> > > On 11/12/09 23:56, Ronald Kyamagero wrote: >> >> Hi all, >> >> Thanks for your help. It works! >> >> However, when I try to incorporate it into my site, it does not work. >> >> Hi Ronald, >> >> I think it's the computed width. Since you're using a computed width for >> your containing block (100%) rather than a fixed width, (ie: 980px), the >> inside blocks don't know how to compute their "auto" margins. >> >> This problem has tripped me up several times and I think that it's the >> reason many sites use a fixed width layout. >> >> You might have to do without the proper usage of the min-width for the >> outer block, but you might be able able to mostly accomplish the look you're >> going for by giving that outerWrapper block a "margin: 0 auto" also. >> >> If you want it to really be perfect, you might be able to be able to >> adjust the width of the outerWrapper to match the width of the content area >> of the window with JavaScript, but there might be a moment when your page >> first loads that it doesn't look quite right. >> >> >> >> >> Here is my code: >> >> body { >> text-align: center; >> min-width: 980px; >> font-family: Arial, Verdana, Helvetica, sans-serif; >> font-size: 14px; >> color: #525252; >> background-color: #fff; >> margin: 0px; >> background-image: url(../images/body_bg.jpg); >> background-repeat: repeat-x; >> background-position: left top; >> } >> >> >> /* Layout */ >> >> #outerWrapper { >> width: 100%;* <!-- Change this to something fixed.* >> >> min-width: 980px; >> text-align: center; >> background-image: url(../images/footer_bg.jpg); >> background-repeat: repeat-x; >> background-position: left bottom; >> padding-bottom: 123px; >> overflow: auto; >> } >> #innerWrapper { >> margin: 0 auto; >> width: 980px; >> } >> >> >> Why is my innerWrapper not centered in the outerWrapper. >> >> Please advise. >> >> Thanks, >> >> Ronald >> >> 2009/12/11 hariharan k <[email protected]> >> >>> Hi, >>> >>> Can you try like this! >>> >>> <style type="text/css"> >>> .class1 { height:auto; width:300px; margin:0px auto; >>> background-color:#f3f3f3; border:1px solid #a6a6a6; padding:10px; } >>> .class2 { height:auto; width:100px; margin:0px auto; border:1px solid >>> #f50; padding:10px;} >>> </style> >>> >>> <div class="class1"> >>> <div class="class2">Center, middle</div> >>> </div> >>> rEgArDs, >>> Hariharan. K >>> >>> >>> >>> 2009/12/11 Алексей Лиходиевский <[email protected]> >>> >>> Hi! >>>> You can make: >>>> >>>> <div style="width:800px"> >>>> <div style="margin:0 auto; width:400px">inner div</div> >>>> </div> >>>> >>>> >>>> 2009/12/11 Ronald Kyamagero <[email protected]> >>>> >>>> Can someone Help Center Horizontally a div in a div? >>>>> >>>>> I can center a div horizontally in the body. But I find problems >>>>> horizontally centering a div within a div. >>>>> >>>>> Your help will be greatly appreciated. >>>>> >>>>> Thanks, >>>>> >>>>> Ronald >>>>> >>>>> -- >>>>> Tel: +256 414 466365 >>>>> Cell: +256 782 756110 >>>>> >>>>> www.realtechgrp.com >>>>> www.resellerspanelafrica.com >>>>> www.realtechosting.com >>>>> >>>>> Social Networks: >>>>> 1. http://www.linkedin.com/in/ronaldkyamagero 2. >>>>> http://twitter.com/Kyamagero 3. facebook.com/ronald.kyamagero >>>>> >>>>> Are you in need of an efficient web solution? Real Technolgies Group >>>>> (Real Technologies) have the solution tailored to your needs. >>>>> >>>>> Real Technologies is a one stop for your web development, web hosting, >>>>> internet marketing, graphics and animation, and architectural CAD needs. >>>>> Following your requirements, we consistently meet your expectations and >>>>> deliver on time yet keep within your budget. (www.realtechgrp.com) >>>>> >>>>> -- >>> Hariharan. K >>> Web Designer >>> >> >> -- >> Tel: +256 414 466365 >> Cell: +256 782 756110 >> >> www.realtechgrp.com >> www.resellerspanelafrica.com >> www.realtechosting.com >> >> Social Networks: >> 1. http://www.linkedin.com/in/ronaldkyamagero 2. >> http://twitter.com/Kyamagero 3. facebook.com/ronald.kyamagero >> >> Are you in need of an efficient web solution? Real Technolgies Group (Real >> Technologies) have the solution tailored to your needs. >> >> Real Technologies is a one stop for your web development, web hosting, >> internet marketing, graphics and animation, and architectural CAD needs. >> Following your requirements, we consistently meet your expectations and >> deliver on time yet keep within your budget. (www.realtechgrp.com) >> >> >> -- >> *Vince Aggrippino* >> a.k.a. Ghodmode >> www.ghodmode.com >> >> ******************************************************************* >> List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm >> Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm >> Help: [email protected] >> ******************************************************************* >> > > > > -- > Tel: +256 414 466365 > Cell: +256 782 756110 > > www.realtechgrp.com > www.resellerspanelafrica.com > www.realtechosting.com > > Social Networks: > 1. http://www.linkedin.com/in/ronaldkyamagero 2. > http://twitter.com/Kyamagero 3. facebook.com/ronald.kyamagero > > Are you in need of an efficient web solution? Real Technolgies Group (Real > Technologies) have the solution tailored to your needs. > > Real Technologies is a one stop for your web development, web hosting, > internet marketing, graphics and animation, and architectural CAD needs. > Following your requirements, we consistently meet your expectations and > deliver on time yet keep within your budget. (www.realtechgrp.com) > > > ******************************************************************* > List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm > Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm > Help: [email protected] > ******************************************************************* > ******************************************************************* List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [email protected] *******************************************************************
