bbs914
01-06-2010, 08:57 PM
Hi - - I am a bit of a newbie to website design and using CSS. I am created a website that works well for the most part, however it seems to display funny on other's computers - - - In some cases, it has to do with their screen resolution size, but in others the following occurs
- header, or graphic at the top of the page does not display, or if it does, just a small portion of it displays on the left hand side of the screen.
- footer - doesn't go across the whole width of the bottom of the screen. Stands off to the left
Any help in this matter would be greatly appreciated. the main page has a different css sheet than the other webpages.
the css for the pages having the problem is
/* Generated by KompoZer */
.footer {
height: 22px;
text-align: center;
background-color: #235bae;
color: white;
font-family: verdana;
font-size: 10px;
}
.content {
background-color: #f0f0f0;
}
.right {
background-color: #b9b9b9;
}
.rightpanelbox {
width: 100%;
background-color: #fdfbec;
height: 20%;
}
.boxstyle {
border: 1px solid #284151;
width: 90%;
background-color: #fdfbec;
}
.boxstyle td {
border-width: 0px;
padding: 0;
background-color: #fdfbec;
text-align: left;
}
.headingstyle {
font-weight: bold;
font-size: 1.3em;
color: #235bae;
}
p {
font-size: 13px;
font-family: verdana;
}
.padded {
padding: 10px;
}
.smallfont {
font-size: 13px;
font-family: verdana,sans-serif;
}
.medfontbold {
font-weight: bold;
font-size: 15px;
font-family: verdana,sans-serif;
}
.smallfont td {
font-size: 13px;
font-family: verdana,sans-serif;
}
.medfontbold td {
font-weight: bold;
font-size: 15px;
font-family: verdana,sans-serif;
}
.left {
background-color: #b9b9b9;
text-decoration: none;
}
.navbarmenu td {
border-width: 0px;
padding: 0px 10px 0px 0px;
color: #999999;
font-family: verdana,sans-serif;
font-weight: bold;
font-size: 14px;
}
.navbar td {
padding: 0px 0px 0px 30px;
background-repeat: repeat-x;
font-size: 14px;
font-family: verdana,sans-serif;
background-color: #235bae;
color: white;
text-align: center;
}
.navbar {
width: 100%;
height: 27px;
}
.header {
padding: 0px;
width: 100%;
height: 300px;
background-position: center center;
background-repeat: no-repeat;
background-image: url(fmtheader.jpg);
}
.header td {
border-width: 0px;
text-align: left;
}
.global {
width: 100%;
height: 100%;
}
.global td {
border: 1px solid #235bae;
}
body {
margin: 0;
padding: 0;
background-color: white;
color: black;
}
a:link {
text-decoration: none;
color: white;
}
a:visited {
text-decoration: underline;
color: white;
}
a:hover {
text-decoration: underline;
font-size: 112%;
color: white;
}
a:active {
text-decoration: underline;
color: white;
}
#menucontainer {
padding: 5px 6px 5px 5px;
text-decoration: none;
list-style-type: none;
background-color: #b9b9b9;
}
#menucontainer ul {
border: medium solid white;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
margin-top: 0;
margin-bottom: 0;
margin-left: 0;
text-decoration: none;
list-style-type: none;
}
#menucontainer li {
border: 1px dotted white;
padding-top: 5px;
padding-bottom: 5px;
text-decoration: none;
background-color: #235bae;
}
#menucontainer a {
text-decoration: none;
font-weight: bold;
font-family: verdana;
font-size: small;
color: white;
}
#menucontainer li:hover {
border: thin solid white;
background-color: #cccccc;
color: black;
font-weight: bold;
}
#menucontainer a:hover {
background-color: #cccccc;
color: black;
font-weight: bold;
}
#menucontainer ul ul {
visibility: hidden;
position: absolute;
margin-top: -2em;
width: 200px;
}
#menucontainer li:hover > ul {
visibility: visible;
text-decoration: none;
background-color: #cccccc;
}
#menucontainer li:hover ul {
visibility: visible;
}
#menucontainer li:hover li:hover ul {
visibility: visible;
}
#menucontainer li:hover ul ul {
visibility: hidden;
}
a.rightlink {
text-decoration: none;
font-size: small;
font-family: verdana;
font-weight: inherit;
text-transform: lowercase;
}
a.rightlink:link {
}
a.rightlink:visited {
}
a.rightlink:active {
text-decoration: underline;
}
a.rightlink:hover {
text-decoration: underline;
color: black;
background-color: #ffff33;
}
a.middlelink {
}
a.middlelink:link {
color: black;
text-decoration: underline;
}
a.middlelink:visited {
color: black;
}
a.middlelink:hover {
font-size: small;
color: black;
text-decoration: underline;
}
a.middlelink:active {
color: #6600cc;
}
if you'd be able to check out the pages - they are at www.fairmont.org
Thanks in advance for your help.
- header, or graphic at the top of the page does not display, or if it does, just a small portion of it displays on the left hand side of the screen.
- footer - doesn't go across the whole width of the bottom of the screen. Stands off to the left
Any help in this matter would be greatly appreciated. the main page has a different css sheet than the other webpages.
the css for the pages having the problem is
/* Generated by KompoZer */
.footer {
height: 22px;
text-align: center;
background-color: #235bae;
color: white;
font-family: verdana;
font-size: 10px;
}
.content {
background-color: #f0f0f0;
}
.right {
background-color: #b9b9b9;
}
.rightpanelbox {
width: 100%;
background-color: #fdfbec;
height: 20%;
}
.boxstyle {
border: 1px solid #284151;
width: 90%;
background-color: #fdfbec;
}
.boxstyle td {
border-width: 0px;
padding: 0;
background-color: #fdfbec;
text-align: left;
}
.headingstyle {
font-weight: bold;
font-size: 1.3em;
color: #235bae;
}
p {
font-size: 13px;
font-family: verdana;
}
.padded {
padding: 10px;
}
.smallfont {
font-size: 13px;
font-family: verdana,sans-serif;
}
.medfontbold {
font-weight: bold;
font-size: 15px;
font-family: verdana,sans-serif;
}
.smallfont td {
font-size: 13px;
font-family: verdana,sans-serif;
}
.medfontbold td {
font-weight: bold;
font-size: 15px;
font-family: verdana,sans-serif;
}
.left {
background-color: #b9b9b9;
text-decoration: none;
}
.navbarmenu td {
border-width: 0px;
padding: 0px 10px 0px 0px;
color: #999999;
font-family: verdana,sans-serif;
font-weight: bold;
font-size: 14px;
}
.navbar td {
padding: 0px 0px 0px 30px;
background-repeat: repeat-x;
font-size: 14px;
font-family: verdana,sans-serif;
background-color: #235bae;
color: white;
text-align: center;
}
.navbar {
width: 100%;
height: 27px;
}
.header {
padding: 0px;
width: 100%;
height: 300px;
background-position: center center;
background-repeat: no-repeat;
background-image: url(fmtheader.jpg);
}
.header td {
border-width: 0px;
text-align: left;
}
.global {
width: 100%;
height: 100%;
}
.global td {
border: 1px solid #235bae;
}
body {
margin: 0;
padding: 0;
background-color: white;
color: black;
}
a:link {
text-decoration: none;
color: white;
}
a:visited {
text-decoration: underline;
color: white;
}
a:hover {
text-decoration: underline;
font-size: 112%;
color: white;
}
a:active {
text-decoration: underline;
color: white;
}
#menucontainer {
padding: 5px 6px 5px 5px;
text-decoration: none;
list-style-type: none;
background-color: #b9b9b9;
}
#menucontainer ul {
border: medium solid white;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
margin-top: 0;
margin-bottom: 0;
margin-left: 0;
text-decoration: none;
list-style-type: none;
}
#menucontainer li {
border: 1px dotted white;
padding-top: 5px;
padding-bottom: 5px;
text-decoration: none;
background-color: #235bae;
}
#menucontainer a {
text-decoration: none;
font-weight: bold;
font-family: verdana;
font-size: small;
color: white;
}
#menucontainer li:hover {
border: thin solid white;
background-color: #cccccc;
color: black;
font-weight: bold;
}
#menucontainer a:hover {
background-color: #cccccc;
color: black;
font-weight: bold;
}
#menucontainer ul ul {
visibility: hidden;
position: absolute;
margin-top: -2em;
width: 200px;
}
#menucontainer li:hover > ul {
visibility: visible;
text-decoration: none;
background-color: #cccccc;
}
#menucontainer li:hover ul {
visibility: visible;
}
#menucontainer li:hover li:hover ul {
visibility: visible;
}
#menucontainer li:hover ul ul {
visibility: hidden;
}
a.rightlink {
text-decoration: none;
font-size: small;
font-family: verdana;
font-weight: inherit;
text-transform: lowercase;
}
a.rightlink:link {
}
a.rightlink:visited {
}
a.rightlink:active {
text-decoration: underline;
}
a.rightlink:hover {
text-decoration: underline;
color: black;
background-color: #ffff33;
}
a.middlelink {
}
a.middlelink:link {
color: black;
text-decoration: underline;
}
a.middlelink:visited {
color: black;
}
a.middlelink:hover {
font-size: small;
color: black;
text-decoration: underline;
}
a.middlelink:active {
color: #6600cc;
}
if you'd be able to check out the pages - they are at www.fairmont.org
Thanks in advance for your help.