List Info

Thread: RE: CSS Margins
RE: CSS Margins
country flaguser name
United States		 2007-05-29 15:30:20 
This will be applied to every page of our website (home
page: 
http://www.hampton.lib.
nh.us/). I want the toolbars at the top (which are put 
there with the server side include of a .txt file) to spread
the entire width 
of the page, while the rest of the page has indented
margins. Right now the SSI 
link is inside the <body> tags, and moving them
outside doesn't seem to make a 
difference. I'm looking for a solution that won't require a
major adjustment to 
the entire website, if possible.  My knowledge of CSS is
very rudimentary.

Bill Teschek
bteschekhampton.lib.nh.us

Pons, Lisa (ponslm) wrote:

> As someone else will no doubt say, it is always best to
send a url.
> Without that, it's very hard to tell how to do this
because of
> inheritance... 
> Can you change the code? The easiest way is to put a
wrapper div to wrap
> everything in the fixed width to that width, and
another div for the
> 100% content.
> 
> Lisa
> > -----Original Message-----
> > From: web4lib-bounceswebjunction.org 
> > [mailto:web4lib-bounceswebjunction.org] On Behalf
Of Bill Teschek
> > Sent: Tuesday, May 29, 2007 3:47 PM
> > To: web4libwebjunction.org
> > Subject: [Web4lib] CSS Margins
> > 
> > I've been using the margin-left and margin-right
CSS commands 
> > to control width of the body element of our web
pages. I'd 
> > like to be able to have one small part of the page
NOT use 
> > these settings and display to the full width of
the page. 
> > What is the best way to go about doing that?
> > 
> > Bill Teschek
> > bteschekhampton.lib.nh.us
> > 
> > _______________________________________________
> > Web4lib mailing list
> > Web4libwebjunction.org
> > http://lists.we
bjunction.org/web4lib/
> > 
> _______________________________________________
> Web4lib mailing list
> Web4libwebjunction.org
> http://lists.we
bjunction.org/web4lib/
> 



_______________________________________________
Web4lib mailing list
Web4libwebjunction.org
http://lists.we
bjunction.org/web4lib/
Re: CSS Margins
country flaguser name
United States		 2007-05-29 15:38:40 
On 5/29/2007 4:30 PM, Bill Teschek wrote:

> This will be applied to every page of our website (home
page: 
> http://www.hampton.lib.
nh.us/). I want the toolbars at the top (which are put 
> there with the server side include of a .txt file) to
spread the entire width 
> of the page, while the rest of the page has indented
margins. Right now the SSI 
> link is inside the <body> tags, and moving them
outside doesn't seem to make a 
> difference. I'm looking for a solution that won't
require a major adjustment to 
> the entire website, if possible.  My knowledge of CSS
is very rudimentary.
> 

You cannot include page content outside the <body>
element in valid
markup, so leave it where it is.  Let me suggest two ways to
think about
this:

  body {
    margin-left: 2em;
  }

  div.outdent {
    /* I personally don't care for text that's really
       up against the window chrome, so let's say... */
    margin-left: -1.5em;
  }



OR, if you want to add the necessary structure to your
pages:

  body {
    margin-left: .5em;
  }
  #toolbar {
    margin-left: 0;
  }
  #main-content {
    margin-left: 1.5em;
  }

  /* And maybe consider this? */
  media print {
    #toolbar {
      display: none;
      height: 0;
    }
  }


And then...

  <body>
    <div id="toolbar">[The toolbar via
SSI]</div>
    <div id="main-content">[The actual page
content]</div>
  </body>


-- 
Thomas Dowling
tdowlingohiolink.edu

_______________________________________________
Web4lib mailing list
Web4libwebjunction.org
http://lists.we
bjunction.org/web4lib/
Re: CSS Margins
country flaguser name
United States		 2007-05-29 15:38:40 
On 5/29/2007 4:30 PM, Bill Teschek wrote:

> This will be applied to every page of our website (home
page: 
> http://www.hampton.lib.
nh.us/). I want the toolbars at the top (which are put 
> there with the server side include of a .txt file) to
spread the entire width 
> of the page, while the rest of the page has indented
margins. Right now the SSI 
> link is inside the <body> tags, and moving them
outside doesn't seem to make a 
> difference. I'm looking for a solution that won't
require a major adjustment to 
> the entire website, if possible.  My knowledge of CSS
is very rudimentary.
> 

You cannot include page content outside the <body>
element in valid
markup, so leave it where it is.  Let me suggest two ways to
think about
this:

  body {
    margin-left: 2em;
  }

  div.outdent {
    /* I personally don't care for text that's really
       up against the window chrome, so let's say... */
    margin-left: -1.5em;
  }



OR, if you want to add the necessary structure to your
pages:

  body {
    margin-left: .5em;
  }
  #toolbar {
    margin-left: 0;
  }
  #main-content {
    margin-left: 1.5em;
  }

  /* And maybe consider this? */
  media print {
    #toolbar {
      display: none;
      height: 0;
    }
  }


And then...

  <body>
    <div id="toolbar">[The toolbar via
SSI]</div>
    <div id="main-content">[The actual page
content]</div>
  </body>


-- 
Thomas Dowling
tdowlingohiolink.edu

_______________________________________________
Web4lib mailing list
Web4libwebjunction.org
http://lists.we
bjunction.org/web4lib/
[1-3]

about | contact  Other archives ( Real Estate discussion Medical topics )