On Thu, Jul 14, 2011 at 3:42 AM, John <[email protected]> wrote:
>
> Hello;
>
> I have two questions about this page: http://www.coffeeonmars.com/page.html
>
> 1. Why does the center area not go to the bottom? I put in height:100%; for
> both the body of the document and for that center area.
>
> I noticed while viewing the page at 1024 x 768 that when the browser window is
> shorter, you get a scrollbar; scroll down and you see the center area end, and
> that copy goes beyond it. I don't get why.
I think that 100% height is based on the inner height of the browser window.
So, they are actually going to the bottom of that. However, the overflow is
defaulting to "visible", so the content becomes longer than the element that
contains it.
> and
>
> 2. is there something like baseline shift which can operate on a span tag? the
> small black bar to the right of the top line of type rests on the type
> baseline, but it isn't centered vertically.
It looks like it's centered relative to the text from here (Firefox 5.0 and
Chromium (Google Chrome) 12.0.742.112, Linux), but you could try changing either
line-height or position:relative and top.
> would I need to create a div tag just for that little black bar?
In theory, it's better not to have elements there that are just for appearance.
Design elements should be separated from the content. You should probably do
something creative with the :after pseudo-class on span.headtype ...
span.headtype:after {
content: ".";
color: black;
background-color: black;
width: 46px;
height: 14px;
margin-left: 6px;
}
--
Ghodmode
http://www.ghodmode.com/blog
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
