www.webdeveloper.com
Results 1 to 3 of 3

Thread: Elements Not Appearing

  1. #1
    Join Date
    Jan 2007
    Posts
    5

    Question Elements Not Appearing

    (First off, sorry if this is a duplicate of a thread out there... I searched but being new to CSS, it's hard to know what's the same and what's not...)

    This is my website:
    http://www.boehr-realty.com/test2/index.htm

    This is my CSS code:
    http://www.boehr-realty.com/test2/style.css

    And attached is what I want my website to look like, with the exception of Ryan being vertically centered in that box.

    a) Why doesn't the div with the white background and blue border show up? I tried z-index but that didn't work; unless, of course, I messed it up.

    b) Is there a way to vertically center "Ryan"? I looked and found a lot of pages about it on Google but it was mostly setting line-height to 8em or something of the like. That didn't seem to center it, and the more I increased the em (to 15em, just for example), the box would grow...understandable. However, I don't know of any other way to vertically center it.

    [EDIT] After much tweaking, I think I found my answer to the first part (so you don't even have to embarrass me by telling me my dumb mistakes!! :P). However, I'm still a little confused on the vertically centering.
    Attached Images Attached Images
    Last edited by Ryan123; 01-19-2007 at 12:35 AM.

  2. #2
    Join Date
    Mar 2006
    Location
    Newcastle NSW Australia
    Posts
    4,033
    In your css - the highlighted closing brcket is wrong way around
    Code:
    #container{
    	position: relative;
    	width: 780px;
    	height: 100%;
    	margin: auto;
    {
    Cheers
    Graeme

  3. #3
    Join Date
    Mar 2006
    Location
    Newcastle NSW Australia
    Posts
    4,033
    The h1 tag has default margins, which differ by browser. Adding
    Code:
    margin:0;
    line-height:110px;
    to your h1 css will center the text.

    Good practise to zero all browser default margins / paddings by starting the css file with
    Code:
    * {border:0; margin:0; padding:0;}
    Cheers
    Graeme

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles