emily01
-
Posts
6 -
Joined
-
Last visited
Content Type
Profiles
Forums
Events
Downloads
Gallery
Store
Posts posted by emily01
-
-
Hi there,
Ok so tried it and it did not work, and now the body alignment is acting screwy showing to the right when it is positioned to the left. Any other ideas?
-
I'm seeing that you are using positioning to place your menu which could be the problem because (assuming) the container div does not have position: relative; to keep the nav div position within it.
Also noticed float: center; .... no such animal.
Thanks, of course! You're right about the div.
Ah yes, the float center should have been removed. lol. Thanks much.
-
Hi all,
I'm hoping someone could help me out with this problem as I've created quite a headache trying to figure this out. Here it is:
I'd like to know if someone could tell me why my navbar alignment continues to show up differently on different monitors and/or browsers.
I use different monitors to work. On my laptop screen which is a about a 12" and i use another widescreen monitor which is about 1080px. The laptop shows alignment is ok. when I go to the widerscreen monitor, nav alignment is off. How can i fix so that it shows up the same no matter which monitor? I've done 100% on both background and nav alignment. Please help. Below is the format;
*|* {
margin:0pt;
padding:0pt;
}
body {
background: url(oldpaperrev.jpg);
background-color:#9E5F27;
font-family:georgia,serif;
font-weight: bold;
font-size:18px;
color:#000000;
margin:0;
padding:0;
width: 80%;
}
p {
line-height:1.5;
padding-bottom:12px;
}
ul
{
list-style-type:none;
margin:0;
padding:0;
}
h1 {
font-size:20px;
font-weight:bold;
color:#000000;
line-height:1.5;
}
h2 {
font-size:14px;
font-weight:bold;
color:#000000;
line-height:1.5;
}
#wrapper {
width:960px;
margin:0pt auto;
}
#sitename {
height:55px;
width:960px;
font-size:30px;
color:#gggggg;
font-weight:normal;
padding-top:32px;
text-align:right;
font-style:italic;
}
#content-wrapper {
float:center;
width:960px;
}
#header-image {
}
#image {
width:952px;
height:221px;
align: center;
}
#contents-body {
float:left;
width:960px;
padding:0 20px 10px 15px;
color:#000000;
}
#navigation {
float:left;
width:300px;
margin-bottom:9px;
font-size:12px;
color:#000000;
position: absolute;
top:250px;
left:400px;
height: 100%;
width: 100%;
}
#navigation-links ul {
margin:8px;
padding:;
display: inline;
height: 100%;
width: 100%;
}
#navigation-links li {
font-size:13px;
list-style-type:none;
padding:5px 5px 8px 5px;
display: inline;
}
#active {
color:#636563;
}
#navigation-links a:link {
display:inline;
color:#000;
font-weight: bold;
font-size: 16px;
text-decoration:none;
}
#navigation-links a:hover {
color:#EAB988;
text-decoration:none;
}
#navigation-links a:visited {
color:#EAB988;
text-decoration:none;
}
#active a:link {
color:#EAB988;
text-decoration:none;
}
#active a:hover {
color:#EAB988;
text-decoration:none;
}
#active a:visited {
color:#EAB988;
text-decoration:none;
}
a:link, a:hover, a:visited {
color:#EAB988;
font-weight:normal;
text-decoration:none;
}
#contents {
float:left;
width:704px;
padding:20px 0 0 20px;
}
#footer {
float:left;
background-color:#9E5F27;
width:960px;
height:39px;
margin-bottom:30px;
}
#footer-contents {
float:left;
color:#7F3D17;
font-family:palatino,"times new roman",serif;
padding:12px 10px 0 12px;
}
input {
background-color:#fff;
border:1px solid #999;
font-size:12px;
}
textarea {
background-color:#fff;
border:1px solid #999;
font-size:12px;
}
-
Wickham, thank you so much for answering this question for me. You were right, I was using HTML img tag. I was using the old <body background> tag at that! This totally worked. I cannot believe in all my CSS/HTML books and sheets I could not find the answer to something this elementary in them. They seem to dive into the deeper stuff first. Thanks again!
It sounds as if you are using a normal html image with the <img... > tag if the text is going below it. For a background-image you need to use
body { background: url(image.jpg) fixed top center no-repeat; }Put the above in a stylesheet or inside head section style tags <style type="text/css">........</style> and it shound cover the body background and then your html markup will show on top of it.
-
Ok, so by the question you've guessed that I am super noob.
So far I have not seen how to make this work but here it is. Problem:
I uploaded an image that has color atop and fades to light toward the bottom. This was supposed to be my background image. I set it to be large enough to fill the entire page or screen which shows up fine. I wanted to add text on top of the background image but it keeps putting the text at the bottom of the image. What have I missed?
Do I need to do a "table background" to make the text appear on top of what is supposed to be a background but only showing up as a simple large image. I'm sorry if this is the dumbest CSS question but I really don't know.
CSS...browser headache?
in CSS
Posted
ps I should also mentioned when I cleared the navposition, the menu disappeared.