[thelist] CSS padding with 100% width?

Fri Jan 14 06:39:26 CST 2005

Hi Dmitry, 

It might help you to get to the bottom of this if your HTML was
well-formed and didn't have block-level elements inside in-line
elements, i.e. don't put a <div> inside a <p> (or a <p> inside another
<p> for that matter). 

Once your HTML is well-formed and valid, you should be able to isolate
the issue.  

Incidentally, I'm with Tony - apply the spacing to the contents of the
div, not the div itself, it will save you a lot of trouble down the
road. 

Hope that helps, 
Dan

> 
> Hello!
> 
> Thanks, but it doesn't work, look what I got:
> 
> ================================code=========================
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" 
> xml:lang="en"> <head> <style> BODY { margin : 0; padding : 
> 20px; background : #CCCCCC; } #outer { margin : 0; padding : 
> 0; width : 100%; background : #FF0000; float : left; } #outer p{
>   margin: 20px;
> }
> #inner {
> margin : 0;
> padding : 0;
> background : #00FF00;
> width : 100%;
> float : left;
> }
> #inner p{
>   margin: 20px;
> }
> #content {
> margin : 0;
> padding : 0;
> background : #FFFFFF;
> width : 100%;
> float : left;
> }
> #content p{
>   margin: 20px;
> }
> </style>
> </head>
> <body>
> <div id="outer"><p><div id="inner"><p><div 
> id="content"><p><br /><br /><br /><br /><br 
> /></p></div></p></div></p></div> </body> </html> 
> ================================end of code=========================
> 
> On Friday, 14-Jan-2005 12:10, Tony Crockford wrote:
> > At 09:54 on Friday, 14 Jan 2005, Dmitry Yeskin wrote:
> > > Hello, guys!
> > >
> > > Can anybody help me with CSS?
> > >
> > > I have a problem:
> > > when I have div in other div and that div in other and every divs 
> > > has a padding and width 100% it showing incorrect in all browsers 
> > > except IE.
> > >
> > >
> > > How anyone solve this problem?
> >
> > instead of using padding on the container, apply a margin to the 
> > elements contained inside.
> >
> > e.g
> >
> > instead of using padding:
> >
> > <div id ="content">
> > <p>some texthere</p>
> > </div>
> >
> >
> > with
> >
> > #content {
> >  padding: 10px;
> > }
> >
> >
> > use:
> >
> > #content p{
> >  margin: 10px;
> > }
> >
> >
> > hth
> >
> > ;o)
> 
> -- 
> With best regards,
> Dmitry Yeskin
> CEO of "Web Style" Studio, LLC
> Official Website: http://www.webstylestudio.com
> Unofficial Website: http://www.webstylemasters.com
> Media Department: http://www.webstylemedia.com
> Open Source Projects: http://www.webstyleopen.com
> Personal E-Mail: yeskin at webstylestudio.com
> Work Phone: +38-057-3332989
> Cell Phone: +38-050-9859731
> -- 
> 
> * * Please support the community that supports you.  * * 
http://evolt.org/help_support_evolt/

For unsubscribe and other options, including the Tip Harvester 
and archives of thelist go to: http://lists.evolt.org 
Workers of the Web, evolt ! 