I am trying to help out with a website (http://www.chetekinteriors.com/wordpress) - the background image is what features the column - it is ran by the css settings in a theme I purchased.
For some reason, when I edit the CSS settings for the background image display properties, it shows fine on my mac but on windows and smaller computers the background image placement is wrong.
If I resize my browser window the image changes as well - are there any CSS styles that could help me fix this so that everything is universal on all browsers and computers?
If anyone could help me I would really appreciate it so much...
The website is chetekinteriors.com/wordpress - Attached is my CSS coding:
html, body, form,
h1, h2, h3, h4, h5, h6,
p, img, a
{
margin:0;
padding:0;
outline:0;
border:0;
}
body, textarea
{
font-family:Tahoma!important;
font-size:10px!important;
letter-spacing:2px!important;
}
body
{
background:#333;
font-size:0.8em;
color:#666666;
line-height:175%;
}
#main
{
background:#ffffff url(../images/idea_1.png)
no-repeat!important;background-position:bottom-left!important;
background-attachment:scroll!important;
background-position: 10% 0%!important;
}
p, h1, h2, h3, h4, h5, h6
{
padding:0 0 20px 0;
}
h1, h2, h3, h4, h5, h6
{
color:#333;
font-weight:normal;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
{
text-decoration:none;
}
UL
{
padding:0 0 0 20px;
margin:0 0 20px 0;
}
UL LI
{
padding-top:5px;
padding-bottom:5px;
}
.post UL
{
margin-left:30px;
}
h1 { font-size:2.7em;}
h2 { font-size:2.3em; }
h3 { font-size:1.9em; }
h4 { font-size:1.8em; }
h5 { font-size:1.7em; }
h6 { font-size:1.5em; }
A
{
color:#333!important;
font-family:verdana!important;
font-size:9px!important;
text-transform:uppercase!important;
letter-spacing:3px!important;
text-decoration:none!important;
}
A:hover
{
color:#979797!important;
background-position:1px 17px;
font-family:verdana!important;
font-size:9px!important;
text-transform:uppercase!important;
letter-spacing:3px!important;
text-decoration:none!important;
}
A:visited
{
}
A:active
{
color:#000;
position:relative;
top:1px;
}
#header
{
padding:20px 0 16px 0;
}
/* Ad manager plugin */
.ads LI a
{
display:block;
text-align:center;
margin:3px 0 10px 0;
padding:5px 0;
background:#fff;
}
/* WordPress Calendar Widget styles*/
#wp-calendar
{
width:99%;
}
#wp-calendar caption
{
font-weight:bold;
}
#wp-calendar td
{
border-right:1px solid #eee;
border-bottom:1px solid #eee;
text-align:center;
}
#wp-calendar .pad,
#wp-calendar #prev,
#wp-calendar #next
{
border:0;
}
.post .postmeta
{
padding:2px 10px;
line-height:150%;
margin-bottom:8px;
text-transform:uppercase;
background:#f0f0f0;
font-size:80%;
}
.post .posttitle
{
padding-bottom:5px;
}
.post .postmeta a.comment-count
{
font-weight:bold;
display:block;
float:right;
}
A.more-link
{
margin-top:10px;
}
A.more-link,
.pagenavigation a
{
text-decoration:none;
padding:5px 10px;
background:#f0f0f0;
border:1px solid #ddd;
font-weight:bold;
-moz-border-radius:3px;
-webkit-border-radius:3px;
}
.pagenavigation a
{
font-weight:normal;
font-size:90%;
}
.post-thumbnail .wp-post-image
{
display:block;
margin:0 0 20px 0;
}
.widget-area
{
padding:20px 0;
}
h2.widgettitle
{
padding-bottom:10px;
margin-bottom:5px;
font-size:175%;
border-bottom:1px solid #eee;
}
.sidebarwidget
{
font-size:85%;
margin-bottom:30px;
}
.footerwidget
{
margin-bottom:0;
}
.footerwidget h2.widgettitle
{
border-bottom:0;
}
.widget UL
{
margin:0;
padding:0 0 0 0;
}
.widget UL LI UL
{
padding-left:15px;
}
.widget UL LI
{
list-style-type:none;
padding:1px 0;
}
#footer
{
background:#333;
color:#888;
padding:15px 0 60px 0;
font-size:0.85em;
}
#footer A
{
color:#999;
}
#main .container_12
{
padding-bottom:40px;
}
/* Latest Posts home page widget*/
UL.latest-posts LI A
{
display:block;
font-size:100%;
}
UL.latest-posts LI A
{
text-decoration:none;
}
UL.latest-posts p
{
padding-bottom:0;
}
.latest-posts span
{
background:#d4d4d4;
padding:1px 4px;
font-size:0.8em;
margin-right:10px;
color:#fff;
}
/* Social Icons in Footer */
UL.social LI A
{
margin:0 1px;
}
/* Shadows */
.latest-work-thumbs img,
.shadow,
.ads LI a,
#commentform #comment,
#commentform #author,
#commentform #email,
#commentform #url,
#commentform #submit
{
-webkit-box-shadow: 0px 0px 2px #ddd;
-moz-box-shadow: 0px 0px 2px #ddd;
}
.latest-work-thumbs img:hover,
.hovershadow:hover,
.ads LI a:hover,
OL.commentlist LI:hover .avatar,
#commentform #submit:hover,
.portfolio-thumbnail a:hover img
{
-webkit-box-shadow: 0px 0px 6px #ccc;
-moz-box-shadow: 0px 0px 6px #ccc;
}
.shadow-medium,
.wp-post-image,
.avatar
{
-webkit-box-shadow: 0px 0px 3px #ddd;
-moz-box-shadow: 0px 0px 3px #ddd;
}
.shadow-large
{
-webkit-box-shadow: 0px 0px 4px #444;
-moz-box-shadow: 0px 0px 4px #444;
}
/* HR Line */
hr
{
background-image:url(../images/hr.gif);
background-repeat:repeat-x;
background-color:transparent;
border:0;
margin:20px 0;
height:2px;
}
hr.nopad
{
padding:0;
margin:0;
}
/* Promo / Home Page Slider */
.promo-container
{
margin-bottom:40px;
}
#promo-nav
{
background:url(../images/promo_nav_bg.jpg) repeat-x bottom left;
border:1px solid #dcdcdc;
border-top:0;
padding:12px 10px 10px 10px;
}
#promo-nav UL LI a
{
border:1px solid #d4d4d4;
background:#fff;
text-indent:-9999px;
width:8px;
height:8px;
display:block;
float:left;
margin-left:7px;
}
#promo-nav UL LI a:hover,
#promo-nav .activeSlide
{
background:#d4d4d4;
}
#promo-nav UL LI a:active
{
background:#333;
}
/* Searchform */
.toolbox-vertical
{
margin-bottom:5px;
}
.toolbox-horizontal #searchform
{
margin-top:46px;
}
#searchform form
{
background:#f6f6f6;
border:1px solid #e8e8e8;
width:220px;
}
#searchform #s
{
font-size:0.7em;
padding:6px 0 4px 10px;
color:#b9b9b9;
text-transform:uppercase;
text-align:left;
width:175px;
}
#searchform #s,
#searchform #submit
{
background:transparent;
border:0;
}
UL.searchresults LI H5
{
padding:5px 20px;
}
UL.clean, UL.clean LI
{
margin:0;
padding:0;
list-style-type:none;
display:inline;
}
.alternate, .hidden
{
display:none;
}
.right
{
float:right;
}
.left
{
float:left;
}
/* Generic WP Generated Classes */
.aligncenter,
div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.alignleft {
float: left;
}
.alignright {
float: right;
}
img.alignleft
{
margin:5px 20px 20px 0;
}
img.alignright
{
margin:5px 0 20px 20px;
}
img.aligncenter
{
}
.wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #fff;
padding:8px 3px;
margin: 10px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
.wp-caption img {
margin: 0;
padding:0 0 5px 0;
border: 0 none;
}
.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
padding:5px 0;
padding:0;
margin: 0;
}
/* COMMENT LIST AND FORM */
#commentform #comment,
#commentform #author,
#commentform #email,
#commentform #url,
#commentform #submit
{
border:1px solid #ccc;
-moz-border-radius:3px;
-webkit-border-radius:3px;
padding:5px;
}
#commentform #submit
{
font-weight:bold;
margin-bottom:10px;
color:#777;
cursor:pointer;
}
#commentform #comment,
#commentform #author,
#commentform #email,
#commentform #url
{
width:33%;
color:#777;
font-weight:bold;
}
#commentform label
{
font-size:130%;
font-weight:bold;
display:block;
margin-bottom:4px;
}
#commentform #comment
{
width:75%;
height:175px;
display:block;
margin-bottom:20px;
font-size:130%;
}
h5#comments
{
margin-top:35px;
}
div#respond
{
margin-top:40px;
}
p.cancel-comment-reply
{
padding:0;
}
OL.commentlist
{
margin:0 0 20px 0;
padding:0;
}
OL.commentlist .avatar
{
border:4px solid #fff;
}
OL.commentlist .left
{
width:110px;
}
OL.commentlist .right-comments
{
margin-left:110px;
}
OL.commentlist LI
{
margin-bottom:20px;
padding:15px;
display:block;
}
OL.commentlist LI.even
{
background:#efefef;
border:1px solid #e0e0e0;
-moz-border-radius:3px;
-webkit-border-radius:3px;
}
OL.commentlist LI.bypostauthor
{
background:#fff;
}
a.comment-reply-link
{
font-size:85%;
text-decoration:none;
font-weight:bold;
}
OL.commentlist .author, OL.commentlist .author a
{
padding:10px 0 4px 0;
font-weight:bold;
text-decoration:none;
line-height:110%;
}
.comment-date
{
line-height:100%;
color:#888;
}
UL.children
{
margin:20px 0 10px 0;
}
.bio
{
margin:40px 0 0 0;
}
.bio h5, .bio p
{
margin:0;
padding:0;
}
.bio p
{
font-size:90%;
line-height:175%;
}
.bio .pic
{
width:95px;
float:left;
}
.bio .details
{
width:500px;
float:left;
}
/* Clearfix */
.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
.clearfix {
display: inline-block;
}
html[xmlns] .clearfix {
display: block;
}
* html .clearfix {
height: 1%;
}
/* Menu dropdown fix applied 2.26.10 */
#header
{
position:relative;
z-index:2;
}
.promo-container
{
position:relative;
z-index:1;
}
/* */
.pagenavigation
{
padding:0 10px;
}
/* updated 6.20.10 - wp3 menu now uses children class and so do the comments */
.sf-menu UL.children { margin-top:0; }