Jump to content

Having trouble


Revp

Recommended Posts

Hi all and thanks for having a place where beginners can ask questions.

 

I am very new to this and I have watched the video tutorial and read the others. I am designing my first website and enjoying learning css.

 

My problem is that I have written this page and css file in order to make a header and a nav bar on the left side. I have an image that I want as my background image which is in the correct folder. I also just want a plain color as the background in my nav bar. For the life of me I cannot figure out why it is not working. I have tried several things and have been researching and still can't figure it out. I was hoping someone here could help tell me where I am going wrong and let me know what I am missing or not understanding.

 

My css file cmcss.css --------------------------------------------------------------------------------------

 

/*

 

 

 

*/

 

#container {

 

width: 100%;

 

height: 100%;

 

margin: 0;

 

padding: 0;

 

border: 0;

 

 

}

 

 

/* */

 

#header {

 

width: 98%;

 

height: 20%;

 

border-top: 2px solid #000000;

 

border-bottom: 2px solid #000000;

 

border-left: 2px solid #000000;

 

border-right:2px solid #000000;

 

margin: 2%;

 

text-align: center;

 

font-weight: bold;

 

background-image: url(cmimgs/bright14.jpg);

 

}

 

 

#leftnav {

 

width: 20%;

 

height: 75%;

 

padding: 1%;

 

border-right: 2px solid #000000;

 

text-align: left;

 

font-weight: normal;

 

float: left;

 

background-color: #6495ed;

 

}

 

 

 

 

 

--------------- and then my index.html file ----------------------------

 

 

 

 

 

 

 

 

 

 

C*** ******

 

 

 

 

 

 

 

 

 

My Name

 

 

 

 

 

 

 

Home

Resume

 

 

 

 

 

 

 

 

Thanks ahead of time for any help. I was expecting a big header with my image as the background and a left bar with a plain color background. Instead I get "My Name" and then my list right below it. The links are working. Its just that none of the styling is working. Thanks again for any help.

Link to comment
Share on other sites

Einsteinboi wrote

Also, for the XHTML doctype you should close your tag like so:

 

 

The doctype being used is HTML 4.01 not XHTML, so no need for the forward slash.

 

@Revp

You should also use a body tag in your html file, placed as per below

 

 

All the content of the document......

 

Link to comment
Share on other sites

   My Name   

This is not done right.

 

For starters, underlines on websites are pretty much an indicator that something is a link, so consider if your underline is important enough to confuse someone.

 

However, if you want to keep your underline - then don't use the tag, use your CSS.

 

h1 {text-decoration: underline;}

 

Your header will be (the same) on every page, so use the stylesheet to affect your entire site.

Link to comment
Share on other sites

Thanks everyone for all the help. I got it to work lol.

 

THe missing quotes were on my html but I had accidently erased them when posting while I was going through to hide my name and website info. I wasn't sure on the policy of posting your website so I went through and hid it just to be on the safe side. I didn't want to break any forum rules.

 

I added the body tags to my html file

 

I took out the underline around my header because that was very sound advice Andrea thanks!

 

 

Thank you all so much it worked! I think it was the lack of body tags. Thats the only thing I can figure.

 

Boo yaa!!

Edited by Revp
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...