• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 397
  • Last Modified:

Click through image on a wordpress site

Hello,
We are trying to overlay an image near the navigation menu on the right of a wordpress site. I have succesfully managed to do so, but the problem is we can not click through it on internet explorer. I am using the "pointer-events" method and it works fine on all browsers except for internet explorer. What would be a good way to go about this? I can not really slice all the images and remake the website because it is a wordpress site.

Thanks in advance!
0
onBasics
Asked:
onBasics
  • 10
  • 10
1 Solution
 
jonahzonaCommented:
Can I get a link?
0
 
onBasicsAuthor Commented:
0
 
jeremyjared74Commented:
You can add this to the bottom of the style.css file and it will fix it. This will move the sidebar down a little, but it was necessary. I set the z-index of the sidebar higher than the image so the sidebar was over the image which is why I moved it down a touch.
#layer1 img {
display: block;
margin: 0 !important;
padding: 0 !important;
position: absolute !important;
z-index: 11; !important;
width: 500px;
height: 800px;
overflow: hidden;
float: right;
}
#sidebar, #sidebar .widgetcontent {
display: block !important;
position: relative;
}
#sidebar {
z-index: 9898 !important;
margin-top: 50px;
}
.widgetcontent {
z-index: 9876 !important;
}

Open in new window

0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
onBasicsAuthor Commented:
Thanks for the support so far.
This has been working perfectly, but we found that our embedded Google Calendar is not clickable near the cross.  Can you offer any assistance?

Here's a link to the calendar.  You'll see you cannot click on any dates near the cross.
http://www.saintmaryplano.com/category/calendar2/
0
 
jeremyjared74Commented:
It's been almost 2 months. Do you plan on closing this question? It can always be asked in another one.
0
 
onBasicsAuthor Commented:
I was hoping to ping the guys that were already familar with my problem.
0
 
jeremyjared74Commented:
Anyway, this should fix you up:

Replace the style.css with this:

/*
Theme Name: WP Church
Theme URI: http://www.rainnetdev.com/demo/wpchurch
Description: The first "church" themed website on Theme Forest!
Version: 5.0
Author: Chris Molitor
Tags: church, doves, crosses, two columns, widgets
*/
/* -----BODY, CONTAINER, and PAGE STUFF----- */
html {
background:url(images/html_tile.jpg);
}

body {
font-size:62.5%;
font-family:'Lucida Grande', Verdana, Arial, Sans-Serif;
color:#261D0C;
margin:0;
padding:0;
}

#headerContainer {
background-repeat:repeat-x;
background-position:top left;
width:100%;
height:186px;
margin:0;
padding:0;
}

#pageContainer {
background:url(images/tile.jpg);
margin:0;
padding:0;
width:100%;
}

#page {
text-align:left;
width:1005px;
margin:0 auto;
padding:0;
}

#footerContainer {
background:url(images/footer_tile.jpg) repeat-x top;
width:100%;
height:133px;
margin:0;
padding:0;
}

/* ----TOOL TIP STYLE----- */
.itooltip {
position:absolute;
display:none;
background:#fff;
padding:7px;
font-size:12px;
letter-spacing:0;
color:#000;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
}

/* -----A TAG STUFF----- */
a {
text-decoration:none;
}

a:hover {
text-decoration:underline;
}

a:active {
outline:none;
}

/* -----H TAG STUFF----- */
h1,h2,h3 {
font-family:'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
}

h1 {
font-size:4em;
}

h2 {
font-size:1.6em;
margin:0;
}

h2.pagetitle {
font-size:1.6em;
text-align:left;
}

h3 {
font-size:1.3em;
margin:30px 0 0;
padding:0;
}

h1,h1 a,h1 a:hover,h1 a:visited {
text-decoration:none;
}

h2,h2 a,h2 a:visited,h3,h3 a,h3 a:visited {
color:#261D0C;
}

h2,h2 a,h2 a:hover,h2 a:visited,h3,h3 a,h3 a:hover,h3 a:visited,#sidebar h2,#wp-calendar caption,cite {
text-decoration:none;
}

/* -----HEADER STUFF----- */
#header {
background-repeat:no-repeat;
height:186px;
width:960px;
padding:0;
margin:0 auto;
}

#header #new {
float:right;
width:120px;
margin-top:-5px;
}

#header #logo {
padding:17px 0 0 65px;
}

/* -----NAVIGATION STUFF----- */
#header .pagenav {
padding-top:20px;
height:30px;
}

.pagenav a {
display:block;
padding:7px 10px;
color:#ebe7de;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
font-weight:bold;
}

.pagenav li {
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}

.pagenav a:hover {
background:#6a3b14 url(images/buttonback.jpg) repeat-x center;
text-decoration:none;
border:1px solid #6a3b14;
padding:6px 9px;
}

#dropmenu {
margin:0;
padding:0;
list-style-type:none;
list-style-position:outside;
position:relative;
line-height:1.5em;
z-index:300;
font-weight:bold;
}

#dropmenu li {
float:left;
position:relative;
margin:0 5px 0 0;
font-size:12px;
font-family:verdana,sans-serif;
text-transform:uppercase;
}

#dropmenu li ul {
margin:0;
padding:0;
list-style-type:none;
list-style-position:outside;
line-height:1.5em;
z-index:311;
position:absolute;
display:none;
width:200px;
top:29px;
left:0;
background:#6a3b14;
border:10px solid #6a3b14;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}

#dropmenu li ul a {
-moz-border-radius:0;
-webkit-border-radius:0;
border-radius:0;
font-size:10px;
width:180px;
height:auto;
float:left;
margin:0;
border-top:1px solid #834e23;
border-bottom:1px solid #532f11;
}

#dropmenu li ul a:hover {
background:#46270e;
text-decoration:none;
border-left:none;
border-right:none;
border-top:1px solid #46270e;
color:#fff;
padding:7px 10px;
}

#dropmenu li ul li {
margin:0;
}

#dropmenu li ul li ul {
top:-10px;
left:200px;
margin:0;
}

#dropmenu li:hover ul ul,#dropmenu li:hover ul ul ul,#dropmenu li:hover ul ul ul ul {
display:none;
}

#dropmenu li:hover ul,#dropmenu li li:hover ul,#dropmenu li li li:hover ul,#dropmenu li li li li:hover ul {
display:block;
background:#6a3b14;
}

#header .pagenav .current_page_item a,#header .pagenav .current-cat a,#header .pagenav .current_page_parent a {
background:#6a3b14 url(images/buttonback.jpg) repeat-x center;
border:1px solid #6a3b14;
padding:6px 9px;
}

#header .pagenav .current_page_item ul li a,#header .pagenav .current-cat ul li a,#header .pagenav .current_page_parent ul li a {
background:#6a3b14;
border-top:1px solid #834e23;
border-bottom:1px solid #532f11;
}

#header .pagenav .current_page_item ul li a:hover,#header .pagenav .current-cat ul li a:hover,#header .pagenav .current_page_parent ul li a:hover {
background:#46270e;
}

/* -----SEARCH STUFF----- */
#searchform {
text-align:center;
}

#searchform #s {
width:170px;
border:1px solid #ddd;
background:#fff;
padding:3px;
}

#searchsubmit {
cursor:pointer;
font-size:10px;
padding:3px 5px;
background:#6a3b14;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
line-height:20px;
color:#ebe7de;
border:none;
}

#searchsubmit:hover {
background:#271E0D;
color:#ebe7de;
text-decoration:none;
}

/* -----FEATURED STUFF----- */
#featuredContainer {
margin:0 0 40px;
padding:0;
width:560px;
position:relative;
height:290px;
overflow:hidden;
border:1px solid #666;
border-bottom:none;
}

#featured {
overflow:hidden;
width:560px;
height:290px;
position:relative;
}

#featured ul,#featured li {
margin:0;
padding:0;
list-style:none;
position:relative;
overflow:hidden;
width:560px;
height:290px;
}

#featured li h2 a {
position:absolute;
bottom:0;
left:0;
line-height:36px;
padding:0;
text-align:center;
font-size:12px;
color:#fff;
background-repeat:repeat-x;
background-position:left center;
width:100%;
font-weight:bold;
}

#featured li h2 a {
color:#fff;
}

span#prevBtn a,span#prevBtn a:link,span#prevBtn a:visited,span#nextBtn a,span#nextBtn a:link,span#nextBtn a:visited {
margin:0;
font-weight:bold;
cursor:pointer;
position:absolute;
font-size:12px;
padding:8px 15px;
background:#6a3b14 url(images/buttonback.jpg) repeat-x center;
line-height:20px;
color:#fff;
font-weight:bold;
outline:none;
}

span#prevBtn a {
bottom:0;
left:0;
border-right:1px solid #89642D;
}

span#nextBtn a {
bottom:0;
right:0;
border-left:1px solid #89642D;
}

span#prevBtn a:hover,span#nextBtn a:hover {
text-decoration:none;
background:#6a3b14 url(images/buttonback.jpg) repeat-x top;
}

span#prevBtn a:active,span#nextBtn a:active {
background:#6a3b14 url(images/buttonback.jpg) repeat-x bottom;
}

/* -----POST STUFF----- */
.narrowcolumn {
float:left;
display:inline;
width:650px;
padding:0;
font-size:1.2em;
margin:0;
}

.post_container {
margin:0 0 30px;
background:url(images/post_tile.jpg);
border:1px solid #9c9a88;
}

.post {
padding:30px 42px;
background:url(images/post_top.jpg) repeat-x;
border:1px solid #edecd8;
}

.postListing {
margin-top:20px;
}

.post hr {
display:block;
}

h2.pageTitle {
font-size:2em;
}

.post h2 {
text-align:left;
}

.entry {
line-height:1.4em;
margin-top:20px;
}

.entry p a:visited {
color:#1020BC;
text-decoration:none;
}

.entry li.pagenav {
list-style:none;
}

.entry ul li {
padding-bottom:10px;
}

small {
font-family:Arial, Helvetica, Sans-Serif;
font-size:.9em;
line-height:1.5em;
}

.buttons a {
font-size:10px;
padding:5px 15px;
background:#6a3b14 url(images/buttonback.jpg) repeat-x center;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
line-height:20px;
color:#ebe7de;
border:1px solid #522a0d;
}

.buttons a:hover {
background:#805425;
color:#ebe7de;
text-decoration:none;
}

.share span {
margin-right:15px;
}

.breadcrumb {
text-transform:uppercase;
}

.calendarPost {
background:url(images/calendar.jpg) no-repeat top left;
width:50px;
float:left;
text-align:center;
margin:0 8px 0 0;
}

.calendarPost .month {
font-size:10px;
font-weight:bold;
color:#fff;
padding:4px 0 0;
}

.calendarPost .day {
font-size:14px;
font-weight:bold;
color:#000;
padding:8px 5px;
}

blockquote {
padding-left:20px;
margin:15px 30px 0 10px;
}

blockquote cite {
display:block;
margin:5px 0 0;
}

.subStuff {
margin:0;
padding:0;
line-height:1.7em;
list-style:inside;
list-style-image:url(images/bullet.jpg);
}

/* ------HOME PAGE POST STUFF--------- */
.homePost {
width:553px;
}

.homePost .entry {
margin-top:5px;
}

.homePost .buttons {
float:right;
z-index:4867;
position:relative;
}

#homeBlog {
float:right;
}

/* -----SIDEBAR STUFF----- */
#sidebar {
font:1em 'Lucida Grande', Verdana, Arial, Sans-Serif;
float:right;
width:200px;
background:url(images/post_tile.jpg);
border:1px solid #9c9a88;
border-bottom:none;
}

#sidebar .widget {
font-size:12px;
}

#sidebar .widget .widgetcontent {
display:none;
padding:15px;
border-bottom:1px solid #a6a38c;
}

#sidebar h2 {
padding:10px 15px;
font-size:14px;
background:url(images/post_top.jpg) repeat-x;
border:1px solid #dad8c3;
border-bottom:1px solid #9c9a88;
border-top:1px solid #DDDCC8;
}

#sidebar ul,#sidebar ul ol {
margin:0;
padding:0;
}

#sidebar ul li {
list-style-type:none;
list-style-image:none;
}

#sidebar ul p,#sidebar ul select {
margin:5px 0 8px;
}

ol li,#sidebar ul ol li {
list-style:decimal outside;
}

#sidebar ul ul li,#sidebar ul ol li {
margin:3px 0 0;
padding:0;
}

#sidebar form {
margin:0;
}

#sidebar ul li ul li,#sidebar ul li ol li {
line-height:1.7em;
list-style:inside;
list-style-image:url(images/bullet.jpg);
}

#sidebar ul li ul li ul li,#sidebar ul li ol li ol li {
margin-left:40px;
font-size:11px;
list-style:outside;
}

/* -----COMMENT STUFF----- */
.commentlist li,#commentform input,#commentform textarea {
font:.9em 'Lucida Grande', Verdana, Arial, Sans-Serif;
}

.commentlist li {
font-weight:bold;
list-style:none;
margin:15px 0 3px;
padding:5px 10px 3px;
}

.commentlist li .avatar {
float:left;
border:0 solid #eee;
background:#000000;
margin-right:5px;
padding:0;
}

.commentlist cite,.commentlist cite a {
font-weight:bold;
font-style:normal;
font-size:1.1em;
}

.commentlist p {
font-weight:normal;
line-height:1.5em;
text-transform:none;
margin:10px 5px 10px 38px;
}

#commentform p {
font-family:'Lucida Grande', Verdana, Arial, Sans-Serif;
margin:5px 0;
}

.commentmetadata {
font-weight:normal;
display:block;
margin:0;
}

#commentform input {
width:170px;
margin:5px 5px 1px 0;
background:#fff;
}

#commentform input,#commentform textarea {
padding:5px;
border:1px solid #a6a38c;
}

#commentform textarea {
width:99%;
background:#fff;
}

#commentform #submit {
cursor:pointer;
font-size:10px;
padding:3px 0;
background:#6a3b14 url(images/buttonback.jpg) repeat-x center;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
line-height:20px;
color:#ebe7de;
border:1px solid #522a0d;
}

#commentform #submit:hover {
background:#805425;
color:#ebe7de;
text-decoration:none;
}

.commentlist {
text-align:justify;
padding:0;
}

.nocomments {
text-align:center;
margin:0;
padding:0;
}

h3.comments {
margin:40px auto 20px;
padding:0;
}

#recentcomments li {
line-height:1.5em;
}

.alt {
margin:0;
padding:0;
}

/* -----UNIVERSAL STUFF----- */
code {
font:1.1em 'Courier New', Courier, Fixed;
}

acronym,abbr,span.caps {
font-size:.9em;
letter-spacing:.07em;
cursor:help;
}

p img {
max-width:100%;
padding:0;
}

img.centered {
display:block;
margin-left:auto;
margin-right:auto;
}

img.alignright {
display:inline;
margin:0 0 2px 7px;
padding:4px;
}

img.alignleft {
display:inline;
margin:0 7px 2px 0;
padding:4px;
}

.alignright {
float:right;
margin-left:10px;
}

.alignleft {
float:left;
}

select {
width:130px;
}

acronym.abbr {
border-bottom:1px dashed #999;
}

.center {
text-align:center;
}

hr {
display:none;
}

a img {
border:none;
}

.navigation {
display:block;
margin-bottom:10px;
z-index:100;
}

img#wpstats {
width:0;
height:0;
border:none;
overflow:hidden;
padding:0;
}

#hideme {
visibility:hidden;
}

.hidden {
visibility:hidden;
}

.rssSummary {
padding-bottom:15px;
}

.clear {
clear:both;
}

p.clear {
height:1px;
width:1px;
margin:0;
padding:0;
}

/* -----CALENDAR WIDGET STUFF----- */
#wp-calendar {
empty-cells:show;
width:155px;
margin:10px auto 0;
}

#wp-calendar #prev a,#wp-calendar #next a {
font-size:9pt;
}

#wp-calendar #next a {
padding-right:10px;
text-align:right;
}

#wp-calendar #prev a {
padding-left:10px;
text-align:left;
}

#wp-calendar a {
text-decoration:none;
display:block;
}

#wp-calendar caption {
font:bold 1.3em 'Lucida Grande', Verdana, Arial, Sans-Serif;
text-align:center;
width:100%;
}

#wp-calendar th {
font-style:normal;
text-transform:capitalize;
}

#wp-calendar td {
text-align:center;
padding:3px 0;
}

#wp-calendar td.pad:hover {
background-color:#fff;
}

/* -----FOOTER STUFF----- */
#footer {
background:url(images/footer.jpg) no-repeat top;
width:960px;
height:200px;
margin:0 auto;
text-align:left;
padding:0;
}

#footer a {
color:#615C50;
}

#footer #socialMedia {
width:100px;
float:right;
padding:70px 0 0;
text-align:right;
}

#footer #socialMedia a {
padding-right:5px;
}

#footer #copyright {
padding:165px 0 0;
color:#615C50;
}

#footer #copyright li {
list-style:none;
display:inline;
}

#layer1 img {
display:block;
margin:0!important;
padding:0!important;
position:absolute!important;
z-index:11;
width:500px;
height:800px;
overflow:hidden;
float:right;
}

#sidebar,#sidebar .widgetcontent {
position:relative;
}

#sidebar {
z-index:5454!important;
margin-top:50px;
}

.widgetcontent {
z-index:5555!important;
}

div.post  {
display:block;
position:relative;
z-index:7777;
outline:none !important;
border-left:none;
border:none;
}

Open in new window

0
 
jeremyjared74Commented:
I am the guy that is familiar,since I fixed it last time.
0
 
onBasicsAuthor Commented:
Thank you Jeremy.

The calendar works again, but check out the home page, the cross is now in front of that main text area.
http://theme.saintmaryplano.com/

Thanks a TON for the help so far.
0
 
jeremyjared74Commented:
Here you go, I made the image a touch smaller, but it was a compromise:
/*
Theme Name: WP Church
Theme URI: http://www.rainnetdev.com/demo/wpchurch
Description: The first "church" themed website on Theme Forest!
Version: 5.0
Author: Chris Molitor
Tags: church, doves, crosses, two columns, widgets
*/
/* -----BODY, CONTAINER, and PAGE STUFF----- */
html {
background:url(images/html_tile.jpg);
}

body {
font-size:62.5%;
font-family:'Lucida Grande', Verdana, Arial, Sans-Serif;
color:#261D0C;
margin:0;
padding:0;
}

#headerContainer {
background-repeat:repeat-x;
background-position:top left;
width:100%;
height:186px;
margin:0;
padding:0;
}

#pageContainer {
background:url(images/tile.jpg);
margin:0;
padding:0;
width:100%;
}

#page {
text-align:left;
width:1005px;
margin:0 auto;
padding:0;
}

#footerContainer {
background:url(images/footer_tile.jpg) repeat-x top;
width:100%;
height:133px;
margin:0;
padding:0;
}

/* ----TOOL TIP STYLE----- */
.itooltip {
position:absolute;
display:none;
background:#fff;
padding:7px;
font-size:12px;
letter-spacing:0;
color:#000;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
}

/* -----A TAG STUFF----- */
a {
text-decoration:none;
}

a:hover {
text-decoration:underline;
}

a:active {
outline:none;
}

/* -----H TAG STUFF----- */
h1,h2,h3 {
font-family:'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
}

h1 {
font-size:4em;
}

h2 {
font-size:1.6em;
margin:0;
}

h2.pagetitle {
font-size:1.6em;
text-align:left;
}

h3 {
font-size:1.3em;
margin:30px 0 0;
padding:0;
}

h1,h1 a,h1 a:hover,h1 a:visited {
text-decoration:none;
}

h2,h2 a,h2 a:visited,h3,h3 a,h3 a:visited {
color:#261D0C;
}

h2,h2 a,h2 a:hover,h2 a:visited,h3,h3 a,h3 a:hover,h3 a:visited,#sidebar h2,#wp-calendar caption,cite {
text-decoration:none;
}

/* -----HEADER STUFF----- */
#header {
background-repeat:no-repeat;
height:186px;
width:960px;
padding:0;
margin:0 auto;
}

#header #new {
float:right;
width:120px;
margin-top:-5px;
}

#header #logo {
padding:17px 0 0 65px;
}

/* -----NAVIGATION STUFF----- */
#header .pagenav {
padding-top:20px;
height:30px;
}

.pagenav a {
display:block;
padding:7px 10px;
color:#ebe7de;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
font-weight:bold;
}

.pagenav li {
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}

.pagenav a:hover {
background:#6a3b14 url(images/buttonback.jpg) repeat-x center;
text-decoration:none;
border:1px solid #6a3b14;
padding:6px 9px;
}

#dropmenu {
margin:0;
padding:0;
list-style-type:none;
list-style-position:outside;
position:relative;
line-height:1.5em;
z-index:300;
font-weight:bold;
}

#dropmenu li {
float:left;
position:relative;
margin:0 5px 0 0;
font-size:12px;
font-family:verdana,sans-serif;
text-transform:uppercase;
}

#dropmenu li ul {
margin:0;
padding:0;
list-style-type:none;
list-style-position:outside;
line-height:1.5em;
z-index:311;
position:absolute;
display:none;
width:200px;
top:29px;
left:0;
background:#6a3b14;
border:10px solid #6a3b14;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}

#dropmenu li ul a {
-moz-border-radius:0;
-webkit-border-radius:0;
border-radius:0;
font-size:10px;
width:180px;
height:auto;
float:left;
margin:0;
border-top:1px solid #834e23;
border-bottom:1px solid #532f11;
}

#dropmenu li ul a:hover {
background:#46270e;
text-decoration:none;
border-left:none;
border-right:none;
border-top:1px solid #46270e;
color:#fff;
padding:7px 10px;
}

#dropmenu li ul li {
margin:0;
}

#dropmenu li ul li ul {
top:-10px;
left:200px;
margin:0;
}

#dropmenu li:hover ul ul,#dropmenu li:hover ul ul ul,#dropmenu li:hover ul ul ul ul {
display:none;
}

#dropmenu li:hover ul,#dropmenu li li:hover ul,#dropmenu li li li:hover ul,#dropmenu li li li li:hover ul {
display:block;
background:#6a3b14;
}

#header .pagenav .current_page_item a,#header .pagenav .current-cat a,#header .pagenav .current_page_parent a {
background:#6a3b14 url(images/buttonback.jpg) repeat-x center;
border:1px solid #6a3b14;
padding:6px 9px;
}

#header .pagenav .current_page_item ul li a,#header .pagenav .current-cat ul li a,#header .pagenav .current_page_parent ul li a {
background:#6a3b14;
border-top:1px solid #834e23;
border-bottom:1px solid #532f11;
}

#header .pagenav .current_page_item ul li a:hover,#header .pagenav .current-cat ul li a:hover,#header .pagenav .current_page_parent ul li a:hover {
background:#46270e;
}

/* -----SEARCH STUFF----- */
#searchform {
text-align:center;
}

#searchform #s {
width:170px;
border:1px solid #ddd;
background:#fff;
padding:3px;
}

#searchsubmit {
cursor:pointer;
font-size:10px;
padding:3px 5px;
background:#6a3b14;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
line-height:20px;
color:#ebe7de;
border:none;
}

#searchsubmit:hover {
background:#271E0D;
color:#ebe7de;
text-decoration:none;
}

/* -----FEATURED STUFF----- */
#featuredContainer {
margin:0 0 40px;
padding:0;
width:560px;
position:relative;
height:290px;
overflow:hidden;
border:1px solid #666;
border-bottom:none;
}

#featured {
overflow:hidden;
width:560px;
height:290px;
position:relative;
}

#featured ul,#featured li {
margin:0;
padding:0;
list-style:none;
position:relative;
overflow:hidden;
width:560px;
height:290px;
}

#featured li h2 a {
position:absolute;
bottom:0;
left:0;
line-height:36px;
padding:0;
text-align:center;
font-size:12px;
color:#fff;
background-repeat:repeat-x;
background-position:left center;
width:100%;
font-weight:bold;
}

#featured li h2 a {
color:#fff;
}

span#prevBtn a,span#prevBtn a:link,span#prevBtn a:visited,span#nextBtn a,span#nextBtn a:link,span#nextBtn a:visited {
margin:0;
font-weight:bold;
cursor:pointer;
position:absolute;
font-size:12px;
padding:8px 15px;
background:#6a3b14 url(images/buttonback.jpg) repeat-x center;
line-height:20px;
color:#fff;
font-weight:bold;
outline:none;
}

span#prevBtn a {
bottom:0;
left:0;
border-right:1px solid #89642D;
}

span#nextBtn a {
bottom:0;
right:0;
border-left:1px solid #89642D;
}

span#prevBtn a:hover,span#nextBtn a:hover {
text-decoration:none;
background:#6a3b14 url(images/buttonback.jpg) repeat-x top;
}

span#prevBtn a:active,span#nextBtn a:active {
background:#6a3b14 url(images/buttonback.jpg) repeat-x bottom;
}

/* -----POST STUFF----- */
.narrowcolumn {
float:left;
display:inline;
width:650px;
padding:0;
font-size:1.2em;
margin:0;
}

.post_container {
margin:0 0 30px;
background:url(images/post_tile.jpg);
border:1px solid #9c9a88;
}

.post {
padding:30px 42px;
background:url(images/post_top.jpg) repeat-x;
border:1px solid #edecd8;
}

.postListing {
margin-top:20px;
}

.post hr {
display:block;
}

h2.pageTitle {
font-size:2em;
}

.post h2 {
text-align:left;
}

.entry {
line-height:1.4em;
margin-top:20px;
}

.entry p a:visited {
color:#1020BC;
text-decoration:none;
}

.entry li.pagenav {
list-style:none;
}

.entry ul li {
padding-bottom:10px;
}

small {
font-family:Arial, Helvetica, Sans-Serif;
font-size:.9em;
line-height:1.5em;
}

.buttons a {
font-size:10px;
padding:5px 15px;
background:#6a3b14 url(images/buttonback.jpg) repeat-x center;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
line-height:20px;
color:#ebe7de;
border:1px solid #522a0d;
}

.buttons a:hover {
background:#805425;
color:#ebe7de;
text-decoration:none;
}

.share span {
margin-right:15px;
}

.breadcrumb {
text-transform:uppercase;
}

.calendarPost {
background:url(images/calendar.jpg) no-repeat top left;
width:50px;
float:left;
text-align:center;
margin:0 8px 0 0;
}

.calendarPost .month {
font-size:10px;
font-weight:bold;
color:#fff;
padding:4px 0 0;
}

.calendarPost .day {
font-size:14px;
font-weight:bold;
color:#000;
padding:8px 5px;
}

blockquote {
padding-left:20px;
margin:15px 30px 0 10px;
}

blockquote cite {
display:block;
margin:5px 0 0;
}

.subStuff {
margin:0;
padding:0;
line-height:1.7em;
list-style:inside;
list-style-image:url(images/bullet.jpg);
}

/* ------HOME PAGE POST STUFF--------- */
.homePost {
width:553px;
}

.homePost .entry {
margin-top:5px;
}

.homePost .buttons {
float:right;
z-index:4867;
position:relative;
}

#homeBlog {
float:right;
}

/* -----SIDEBAR STUFF----- */
#sidebar {
font:1em 'Lucida Grande', Verdana, Arial, Sans-Serif;
float:right;
width:200px;
background:url(images/post_tile.jpg);
border:1px solid #9c9a88;
border-bottom:none;
}

#sidebar .widget {
font-size:12px;
}

#sidebar .widget .widgetcontent {
display:none;
padding:15px;
border-bottom:1px solid #a6a38c;
}

#sidebar h2 {
padding:10px 15px;
font-size:14px;
background:url(images/post_top.jpg) repeat-x;
border:1px solid #dad8c3;
border-bottom:1px solid #9c9a88;
border-top:1px solid #DDDCC8;
}

#sidebar ul,#sidebar ul ol {
margin:0;
padding:0;
}

#sidebar ul li {
list-style-type:none;
list-style-image:none;
}

#sidebar ul p,#sidebar ul select {
margin:5px 0 8px;
}

ol li,#sidebar ul ol li {
list-style:decimal outside;
}

#sidebar ul ul li,#sidebar ul ol li {
margin:3px 0 0;
padding:0;
}

#sidebar form {
margin:0;
}

#sidebar ul li ul li,#sidebar ul li ol li {
line-height:1.7em;
list-style:inside;
list-style-image:url(images/bullet.jpg);
}

#sidebar ul li ul li ul li,#sidebar ul li ol li ol li {
margin-left:40px;
font-size:11px;
list-style:outside;
}

/* -----COMMENT STUFF----- */
.commentlist li,#commentform input,#commentform textarea {
font:.9em 'Lucida Grande', Verdana, Arial, Sans-Serif;
}

.commentlist li {
font-weight:bold;
list-style:none;
margin:15px 0 3px;
padding:5px 10px 3px;
}

.commentlist li .avatar {
float:left;
border:0 solid #eee;
background:#000000;
margin-right:5px;
padding:0;
}

.commentlist cite,.commentlist cite a {
font-weight:bold;
font-style:normal;
font-size:1.1em;
}

.commentlist p {
font-weight:normal;
line-height:1.5em;
text-transform:none;
margin:10px 5px 10px 38px;
}

#commentform p {
font-family:'Lucida Grande', Verdana, Arial, Sans-Serif;
margin:5px 0;
}

.commentmetadata {
font-weight:normal;
display:block;
margin:0;
}

#commentform input {
width:170px;
margin:5px 5px 1px 0;
background:#fff;
}

#commentform input,#commentform textarea {
padding:5px;
border:1px solid #a6a38c;
}

#commentform textarea {
width:99%;
background:#fff;
}

#commentform #submit {
cursor:pointer;
font-size:10px;
padding:3px 0;
background:#6a3b14 url(images/buttonback.jpg) repeat-x center;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
line-height:20px;
color:#ebe7de;
border:1px solid #522a0d;
}

#commentform #submit:hover {
background:#805425;
color:#ebe7de;
text-decoration:none;
}

.commentlist {
text-align:justify;
padding:0;
}

.nocomments {
text-align:center;
margin:0;
padding:0;
}

h3.comments {
margin:40px auto 20px;
padding:0;
}

#recentcomments li {
line-height:1.5em;
}

.alt {
margin:0;
padding:0;
}

/* -----UNIVERSAL STUFF----- */
code {
font:1.1em 'Courier New', Courier, Fixed;
}

acronym,abbr,span.caps {
font-size:.9em;
letter-spacing:.07em;
cursor:help;
}

p img {
max-width:100%;
padding:0;
}

img.centered {
display:block;
margin-left:auto;
margin-right:auto;
}

img.alignright {
display:inline;
margin:0 0 2px 7px;
padding:4px;
}

img.alignleft {
display:inline;
margin:0 7px 2px 0;
padding:4px;
}

.alignright {
float:right;
margin-left:10px;
}

.alignleft {
float:left;
}

select {
width:130px;
}

acronym.abbr {
border-bottom:1px dashed #999;
}

.center {
text-align:center;
}

hr {
display:none;
}

a img {
border:none;
}

.navigation {
display:block;
margin-bottom:10px;
z-index:100;
}

img#wpstats {
width:0;
height:0;
border:none;
overflow:hidden;
padding:0;
}

#hideme {
visibility:hidden;
}

.hidden {
visibility:hidden;
}

.rssSummary {
padding-bottom:15px;
}

.clear {
clear:both;
}

p.clear {
height:1px;
width:1px;
margin:0;
padding:0;
}

/* -----CALENDAR WIDGET STUFF----- */
#wp-calendar {
empty-cells:show;
width:155px;
margin:10px auto 0;
}

#wp-calendar #prev a,#wp-calendar #next a {
font-size:9pt;
}

#wp-calendar #next a {
padding-right:10px;
text-align:right;
}

#wp-calendar #prev a {
padding-left:10px;
text-align:left;
}

#wp-calendar a {
text-decoration:none;
display:block;
}

#wp-calendar caption {
font:bold 1.3em 'Lucida Grande', Verdana, Arial, Sans-Serif;
text-align:center;
width:100%;
}

#wp-calendar th {
font-style:normal;
text-transform:capitalize;
}

#wp-calendar td {
text-align:center;
padding:3px 0;
}

#wp-calendar td.pad:hover {
background-color:#fff;
}

/* -----FOOTER STUFF----- */
#footer {
background:url(images/footer.jpg) no-repeat top;
width:960px;
height:200px;
margin:0 auto;
text-align:left;
padding:0;
}

#footer a {
color:#615C50;
}

#footer #socialMedia {
width:100px;
float:right;
padding:70px 0 0;
text-align:right;
}

#footer #socialMedia a {
padding-right:5px;
}

#footer #copyright {
padding:165px 0 0;
color:#615C50;
}

#footer #copyright li {
list-style:none;
display:inline;
}

#layer1 img {
display:block;
margin:0!important;
padding:0!important;
position:absolute!important;
z-index:11;
width:500px;
height:800px;
overflow:hidden;
float:right;
}

#sidebar,#sidebar .widgetcontent {
position:relative;
}

#sidebar {
z-index:5454!important;
margin-top:50px;
}

.widgetcontent {
z-index:5555!important;
}

div.post  {
display:block;
position:relative;
z-index:7777;
outline:none !important;
border-left:none;
border:none;
}
div.narrowcolumn {
position:inherit;
display:inline;
z-index:1;
border:none;
}
div #header div#header div img {
position:relative;
z-index:999999999 !important;;
overflow:visible;
display:inline-block;
height:80%;
width:80%;
margin-left:40px;
margin-top:5px;
}
div #logo {
width:101%;
}

Open in new window

0
 
onBasicsAuthor Commented:
Strage behavior:
Firefox: Works!

IE8: The page loads and all looks good, but about  1 second later the cross and right side of the  header are hidden.

Chrome: Everything is scrunched in the header.
0
 
jeremyjared74Commented:
I thought that might become an issue. I had to use a few "Tricks" to position the image since I don't have access to the original file. If having the image smaller is OK, it can be fixed with fewer CSS Tricks and may fix the inconsistencies.
0
 
onBasicsAuthor Commented:
It is ok that the image is smaller.

Thanks so much for your help,
0
 
onBasicsAuthor Commented:
Is there a version above that doesn't contain the "tricks" that I could use? If not would you mind creating me the new CSS?

Thanks so much,
0
 
jeremyjared74Commented:
I haven't made one yet, but I might be able to help you. The simple way would be to re-size the image so it wasn't done with CSS. I obviously can't do that. You can since you have access to your server.

You can try using this css that I used the W3C validator on. I can't check how the changes look in Chrome or IE, so I don't know if it will work or not.

html {
background : url(images/html_tile.jpg);
}
body {
font-size : 62.5%;
font-family : 'Lucida Grande', Verdana, Arial, Sans-Serif;
color : #261d0c;
margin : 0;
padding : 0;
}
#headerContainer {
background-repeat : repeat-x;
background-position : left top;
width : 100%;
height : 186px;
margin : 0;
padding : 0;
}
#pageContainer {
background : url(images/tile.jpg);
margin : 0;
padding : 0;
width : 100%;
}
#page {
text-align : left;
width : 1005px;
margin : 0 auto;
padding : 0;
}
#footerContainer {
background : url(images/footer_tile.jpg) top repeat-x;
width : 100%;
height : 133px;
margin : 0;
padding : 0;
}
.itooltip {
position : absolute;
display : none;
background : #fff;
padding : 7px;
font-size : 12px;
letter-spacing : 0;
color : #000;
}
a {
text-decoration : none;
}
a:hover {
text-decoration : underline;
}
a:active {
outline : none;
}
h1, h2, h3 {
font-family : 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
}
h1 {
font-size : 4em;
}
h2 {
font-size : 1.6em;
margin : 0;
}
h2.pagetitle {
font-size : 1.6em;
text-align : left;
}
h3 {
font-size : 1.3em;
margin : 30px 0 0;
padding : 0;
}
h1, h1 a, h1 a:hover, h1 a:visited {
text-decoration : none;
}
h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited {
color : #261d0c;
}
h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited, #sidebar h2, #wp-calendar caption, cite {
text-decoration : none;
}
#header {
background-repeat : no-repeat;
height : 186px;
width : 960px;
padding : 0;
margin : 0 auto;
}
#header #new {
float : right;
width : 120px;
margin-top : -5px;
}
#header #logo {
padding : 17px 0 0 65px;
}
#header .pagenav {
padding-top : 20px;
height : 30px;
}
.pagenav a {
display : block;
padding : 7px 10px;
color : #ebe7de;
font-weight : bold;
}
.pagenav a:hover {
background : url(images/buttonback.jpg) center repeat-x #6a3b14;
text-decoration : none;
border : 1px solid #6a3b14;
padding : 6px 9px;
}
#dropmenu {
margin : 0;
padding : 0;
list-style-type : none;
list-style-position : outside;
position : relative;
line-height : 1.5em;
z-index : 300;
font-weight : bold;
}
#dropmenu li {
float : left;
position : relative;
margin : 0 5px 0 0;
font-size : 12px;
font-family : verdana, sans-serif;
text-transform : uppercase;
}
#dropmenu li ul {
margin : 0;
padding : 0;
list-style-type : none;
list-style-position : outside;
line-height : 1.5em;
z-index : 311;
position : absolute;
display : none;
width : 200px;
top : 29px;
left : 0;
background : #6a3b14;
border : 10px solid #6a3b14;
}
#dropmenu li ul a {
font-size : 10px;
width : 180px;
height : auto;
float : left;
margin : 0;
border-top : 1px solid #834e23;
border-bottom : 1px solid #532f11;
}
#dropmenu li ul a:hover {
background : #46270e;
text-decoration : none;
border-left : none;
border-right : none;
border-top : 1px solid #46270e;
color : #fff;
padding : 7px 10px;
}
#dropmenu li ul li {
margin : 0;
}
#dropmenu li ul li ul {
top : -10px;
left : 200px;
margin : 0;
}
#dropmenu li:hover ul ul, #dropmenu li:hover ul ul ul, #dropmenu li:hover ul ul ul ul {
display : none;
}
#dropmenu li:hover ul, #dropmenu li li:hover ul, #dropmenu li li li:hover ul, #dropmenu li li li li:hover ul {
display : block;
background : #6a3b14;
}
#header .pagenav .current_page_item a, #header .pagenav .current-cat a, #header .pagenav .current_page_parent a {
background : url(images/buttonback.jpg) center repeat-x #6a3b14;
border : 1px solid #6a3b14;
padding : 6px 9px;
}
#header .pagenav .current_page_item ul li a, #header .pagenav .current-cat ul li a, #header .pagenav .current_page_parent ul li a {
background : #6a3b14;
border-top : 1px solid #834e23;
border-bottom : 1px solid #532f11;
}
#header .pagenav .current_page_item ul li a:hover, #header .pagenav .current-cat ul li a:hover, #header .pagenav .current_page_parent ul li a:hover {
background : #46270e;
}
#searchform {
text-align : center;
}
#searchform #s {
width : 170px;
border : 1px solid #ddd;
background : #fff;
padding : 3px;
}
#searchsubmit {
cursor : pointer;
font-size : 10px;
padding : 3px 5px;
background : #6a3b14;
line-height : 20px;
color : #ebe7de;
border : none;
}
#searchsubmit:hover {
background : #271e0d;
color : #ebe7de;
text-decoration : none;
}
#featuredContainer {
margin : 0 0 40px;
padding : 0;
width : 560px;
position : relative;
height : 290px;
overflow : hidden;
border : 1px solid #666;
border-bottom : none;
}
#featured {
overflow : hidden;
width : 560px;
height : 290px;
position : relative;
}
#featured ul, #featured li {
margin : 0;
padding : 0;
list-style : none;
position : relative;
overflow : hidden;
width : 560px;
height : 290px;
}
#featured li h2 a {
position : absolute;
bottom : 0;
left : 0;
line-height : 36px;
padding : 0;
text-align : center;
font-size : 12px;
color : #fff;
background-repeat : repeat-x;
background-position : left center;
width : 100%;
font-weight : bold;
}
#featured li h2 a {
color : #fff;
}
span#prevBtn a, span#prevBtn a:link, span#prevBtn a:visited, span#nextBtn a, span#nextBtn a:link, span#nextBtn a:visited {
margin : 0;
font-weight : bold;
cursor : pointer;
position : absolute;
font-size : 12px;
padding : 8px 15px;
background : url(images/buttonback.jpg) center repeat-x #6a3b14;
line-height : 20px;
color : #fff;
font-weight : bold;
outline : none;
}
span#prevBtn a {
bottom : 0;
left : 0;
border-right : 1px solid #89642d;
}
span#nextBtn a {
bottom : 0;
right : 0;
border-left : 1px solid #89642d;
}
span#prevBtn a:hover, span#nextBtn a:hover {
text-decoration : none;
background : url(images/buttonback.jpg) top repeat-x #6a3b14;
}
span#prevBtn a:active, span#nextBtn a:active {
background : url(images/buttonback.jpg) bottom repeat-x #6a3b14;
}
.narrowcolumn {
float : left;
display : inline;
width : 650px;
padding : 0;
font-size : 1.2em;
margin : 0;
}
.post_container {
margin : 0 0 30px;
background : url(images/post_tile.jpg);
border : 1px solid #9c9a88;
}
.post {
padding : 30px 42px;
background : url(images/post_top.jpg) repeat-x;
border : 1px solid #edecd8;
}
.postListing {
margin-top : 20px;
}
.post hr {
display : block;
}
h2.pageTitle {
font-size : 2em;
}
.post h2 {
text-align : left;
}
.entry {
line-height : 1.4em;
margin-top : 20px;
}
.entry p a:visited {
color : #1020bc;
text-decoration : none;
}
.entry li.pagenav {
list-style : none;
}
.entry ul li {
padding-bottom : 10px;
}
small {
font-family : Arial, Helvetica, Sans-Serif;
font-size : 0.9em;
line-height : 1.5em;
}
.buttons a {
font-size : 10px;
padding : 5px 15px;
background : url(images/buttonback.jpg) center repeat-x #6a3b14;
line-height : 20px;
color : #ebe7de;
border : 1px solid #522a0d;
}
.buttons a:hover {
background : #805425;
color : #ebe7de;
text-decoration : none;
}
.share span {
margin-right : 15px;
}
.breadcrumb {
text-transform : uppercase;
}
.calendarPost {
background : url(images/calendar.jpg) left top no-repeat;
width : 50px;
float : left;
text-align : center;
margin : 0 8px 0 0;
}
.calendarPost .month {
font-size : 10px;
font-weight : bold;
color : #fff;
padding : 4px 0 0;
}
.calendarPost .day {
font-size : 14px;
font-weight : bold;
color : #000;
padding : 8px 5px;
}
blockquote {
padding-left : 20px;
margin : 15px 30px 0 10px;
}
blockquote cite {
display : block;
margin : 5px 0 0;
}
.subStuff {
margin : 0;
padding : 0;
line-height : 1.7em;
list-style : inside;
list-style-image : url(images/bullet.jpg);
}
.homePost {
width : 553px;
}
.homePost .entry {
margin-top : 5px;
}
.homePost .buttons {
float : right;
z-index : 4867;
position : relative;
}
#homeBlog {
float : right;
}
#sidebar {
font : 1em 'Lucida Grande', Verdana, Arial, Sans-Serif;
float : right;
width : 200px;
background : url(images/post_tile.jpg);
border : 1px solid #9c9a88;
border-bottom : none;
}
#sidebar .widget {
font-size : 12px;
}
#sidebar .widget .widgetcontent {
display : none;
padding : 15px;
border-bottom : 1px solid #a6a38c;
}
#sidebar h2 {
padding : 10px 15px;
font-size : 14px;
background : url(images/post_top.jpg) repeat-x;
border : 1px solid #dad8c3;
border-bottom : 1px solid #9c9a88;
border-top : 1px solid #dddcc8;
}
#sidebar ul, #sidebar ul ol {
margin : 0;
padding : 0;
}
#sidebar ul li {
list-style-type : none;
list-style-image : none;
}
#sidebar ul p, #sidebar ul select {
margin : 5px 0 8px;
}
ol li, #sidebar ul ol li {
list-style : decimal;
}
#sidebar ul ul li, #sidebar ul ol li {
margin : 3px 0 0;
padding : 0;
}
#sidebar form {
margin : 0;
}
#sidebar ul li ul li, #sidebar ul li ol li {
line-height : 1.7em;
list-style : inside;
list-style-image : url(images/bullet.jpg);
}
#sidebar ul li ul li ul li, #sidebar ul li ol li ol li {
margin-left : 40px;
font-size : 11px;
list-style : ;
}
.commentlist li, #commentform input, #commentform textarea {
font : 0.9em 'Lucida Grande', Verdana, Arial, Sans-Serif;
}
.commentlist li {
font-weight : bold;
list-style : none;
margin : 15px 0 3px;
padding : 5px 10px 3px;
}
.commentlist li .avatar {
float : left;
border : 0 solid #eee;
background : #000000;
margin-right : 5px;
padding : 0;
}
.commentlist cite, .commentlist cite a {
font-weight : bold;
font-style : normal;
font-size : 1.1em;
}
.commentlist p {
font-weight : normal;
line-height : 1.5em;
text-transform : none;
margin : 10px 5px 10px 38px;
}
#commentform p {
font-family : 'Lucida Grande', Verdana, Arial, Sans-Serif;
margin : 5px 0;
}
.commentmetadata {
font-weight : normal;
display : block;
margin : 0;
}
#commentform input {
width : 170px;
margin : 5px 5px 1px 0;
background : #fff;
}
#commentform input, #commentform textarea {
padding : 5px;
border : 1px solid #a6a38c;
}
#commentform textarea {
width : 99%;
background : #fff;
}
#commentform #submit {
cursor : pointer;
font-size : 10px;
padding : 3px 0;
background : url(images/buttonback.jpg) center repeat-x #6a3b14;
line-height : 20px;
color : #ebe7de;
border : 1px solid #522a0d;
}
#commentform #submit:hover {
background : #805425;
color : #ebe7de;
text-decoration : none;
}
.commentlist {
text-align : justify;
padding : 0;
}
.nocomments {
text-align : center;
margin : 0;
padding : 0;
}
h3.comments {
margin : 40px auto 20px;
padding : 0;
}
#recentcomments li {
line-height : 1.5em;
}
.alt {
margin : 0;
padding : 0;
}
code {
font : 1.1em 'Courier New', Courier, Fixed;
}
acronym, abbr, span.caps {
font-size : 0.9em;
letter-spacing : 0.07em;
cursor : help;
}
p img {
max-width : 100%;
padding : 0;
}
img.centered {
display : block;
margin-left : auto;
margin-right : auto;
}
img.alignright {
display : inline;
margin : 0 0 2px 7px;
padding : 4px;
}
img.alignleft {
display : inline;
margin : 0 7px 2px 0;
padding : 4px;
}
.alignright {
float : right;
margin-left : 10px;
}
.alignleft {
float : left;
}
select {
width : 130px;
}
acronym.abbr {
border-bottom : 1px dashed #999;
}
.center {
text-align : center;
}
hr {
display : none;
}
a img {
border : none;
}
.navigation {
display : block;
margin-bottom : 10px;
z-index : 100;
}
img#wpstats {
width : 0;
height : 0;
border : none;
overflow : hidden;
padding : 0;
}
#hideme {
visibility : hidden;
}
.hidden {
visibility : hidden;
}
.rssSummary {
padding-bottom : 15px;
}
.clear {
clear : both;
}
p.clear {
height : 1px;
width : 1px;
margin : 0;
padding : 0;
}
#wp-calendar {
empty-cells : show;
width : 155px;
margin : 10px auto 0;
}
#wp-calendar #prev a, #wp-calendar #next a {
font-size : 9pt;
}
#wp-calendar #next a {
padding-right : 10px;
text-align : right;
}
#wp-calendar #prev a {
padding-left : 10px;
text-align : left;
}
#wp-calendar a {
text-decoration : none;
display : block;
}
#wp-calendar caption {
font : bold 1.3em 'Lucida Grande', Verdana, Arial, Sans-Serif;
text-align : center;
width : 100%;
}
#wp-calendar th {
font-style : normal;
text-transform : capitalize;
}
#wp-calendar td {
text-align : center;
padding : 3px 0;
}
#wp-calendar td.pad:hover {
background-color : #fff;
}
#footer {
background : url(images/footer.jpg) top no-repeat;
width : 960px;
height : 200px;
margin : 0 auto;
text-align : left;
padding : 0;
}
#footer a {
color : #615c50;
}
#footer #socialMedia {
width : 100px;
float : right;
padding : 70px 0 0;
text-align : right;
}
#footer #socialMedia a {
padding-right : 5px;
}
#footer #copyright {
padding : 165px 0 0;
color : #615c50;
}
#footer #copyright li {
list-style : none;
display : inline;
}
#layer1 img {
display : block;
margin : 0 !important ;
padding : 0 !important ;
position : absolute !important ;
z-index : 11;
width : 500px;
height : 800px;
overflow : hidden;
float : right;
}
#sidebar, #sidebar .widgetcontent {
position : relative;
}
#sidebar {
z-index : 5454 !important ;
margin-top : 50px;
}
.widgetcontent {
z-index : 5555 !important ;
}
div.post {
display : block;
position : relative;
z-index : 7777;
outline : none !important ;
border-left : none;
border : none;
}
div.narrowcolumn {
position : inherit;
display : inline;
z-index : 1;
border : none;
}
div #header div#header div img {
position : relative;
z-index : 1000000000 !important ;
overflow : visible;
display : inline-block;
height : 80%;
width : 80%;
margin-left : 40px;
margin-top : 5px;
}
div #logo {
width : 101%;
}
#headerContainer {
background-image : url('http://theme.saintmaryplano.com/wp-content/themes/wpchurch/images/blue/header_tile.jpg');
}
#header {
background-image : url('http://theme.saintmaryplano.com/wp-content/themes/wpchurch/images/blue/header.jpg');
}
#featured li h2 a {
background-image : url('http://theme.saintmaryplano.com/wp-content/themes/wpchurch/images/blue/slidertitle.jpg');
}
a {
color : #456770;
}
#sidebar .widget .widgetcontent {
display : inherit;
}

.gce-page-grid .gce-calendar .gce-caption {
color : #333333;
}
.gce-page-grid .gce-calendar {
width : 100%;
border-collapse : collapse;
border : 1px solid #cccccc;
color : #cccccc;
}
.gce-page-grid .gce-calendar th {
border : 1px solid #cccccc;
text-align : center;
width : 14.29%;
padding : 0 !important ;
}
.gce-page-grid .gce-calendar td {
border : 1px solid #cccccc;
text-align : center;
height : 90px;
vertical-align : middle;
}
.gce-page-grid .gce-calendar .gce-has-events {
color : #333333;
cursor : pointer;
}
.gce-page-grid .gce-calendar .gce-event-info {
display : none;
}
.gce-page-grid .gce-calendar .gce-day-number {
font-size : 2em;
}
.gce-page-grid .gce-calendar .gce-today {
background-color : #dddddd;
}
.gce-page-grid .gce-calendar .gce-next, .gce-page-grid .gce-calendar .gce-prev {
cursor : pointer;
display : inline-block;
width : 3%;
}
.gce-page-grid .gce-calendar .gce-month-title {
display : inline-block;
width : 90%;
}
.gce-page-grid .gce-calendar th abbr {
border-bottom : none !important ;
}
.gce-page-list .gce-list {
margin-top : 10px;
}
.gce-page-list .gce-list li {
margin-top : 5px;
content : none;
}
.gce-page-list .gce-list p {
margin : 0 !important ;
}
.gce-page-list .gce-list p span {
color : #999999;
}
.gce-page-list .gce-list .gce-list-event {
background-color : #dddddd;
}
.gce-page-list .gce-list .gce-list-title {
font-weight : bold;
}
.gce-page-list .gce-list ul {
list-style-type : none;
margin : 0 !important ;
padding : 0 !important ;
}
.gce-widget-grid .gce-calendar .gce-caption {
margin : 10px 0 5px 0;
}
.gce-widget-grid .gce-calendar {
text-align : center;
width : 100%;
border : 1px solid #cccccc;
border-collapse : collapse;
}
.gce-widget-grid .gce-calendar th {
width : 14.29%;
border : 1px solid #cccccc;
}
.gce-widget-grid .gce-calendar td {
color : #cccccc;
width : 14.29%;
border : 1px solid #cccccc;
}
.gce-widget-grid .gce-calendar .gce-has-events {
cursor : pointer;
color : #666666;
}
.gce-widget-grid .gce-calendar .gce-today {
background-color : #dddddd;
}
.gce-widget-grid .gce-calendar .gce-event-info {
display : none;
}
.gce-widget-grid .gce-calendar .gce-next, .gce-widget-grid .gce-calendar .gce-prev {
cursor : pointer;
display : inline-block;
width : 5%;
}
.gce-widget-grid .gce-calendar .gce-month-title {
display : inline-block;
width : 80%;
}
.gce-widget-grid .gce-calendar th abbr {
border-bottom : none !important ;
}
.gce-widget-list .gce-list {
margin : 10px 0 0 0;
}
.gce-widget-list .gce-list li {
margin : 5px 0 0 0;
}
.gce-widget-list .gce-list p {
margin : 0;
}
.gce-widget-list .gce-list p span {
color : #999999;
}
.gce-widget-list .gce-list .gce-list-event {
background-color : #dddddd;
}
.gce-widget-list .gce-list .gce-list-title {
font-weight : bold;
}
.gce-widget-list .gce-list ul {
list-style-type : none;
margin : 0 !important ;
padding : 0 !important ;
}
.gce-event-info {
background-color : #ffffff;
border : 1px solid #333333;
text-align : left;
max-width : 300px;
}
.gce-event-info .gce-tooltip-title {
margin : 5px !important ;
font-weight : bold;
font-size : 1.2em;
}
.gce-event-info ul {
padding : 0 !important ;
margin : 5px !important ;
list-style-type : none !important ;
}
.gce-event-info ul li {
margin : 10px 0 0 0;
}
.gce-event-info ul li p {
margin : 0;
}
.gce-event-info ul li p span {
color : #999999;
}
.gce-event-info .gce-tooltip-event {
background-color : #dddddd;
font-weight : bold;
}
.entry .gce-page-list li:before, #sidebar .gce-widget-list ul li:before {
content : none;
}
.qtrans_flag span {
display : none;
}
.qtrans_flag {
height : 12px;
width : 18px;
display : block;
}
.qtrans_flag_and_text {
padding-left : 20px;
}
.qtrans_flag_en {
background : url(http://theme.saintmaryplano.com/wp-content/plugins/qtranslate/flags/gb.png) no-repeat;
}
.qtrans_flag_es {
background : url(http://theme.saintmaryplano.com/wp-content/plugins/qtranslate/flags/es.png) no-repeat;
}
#fullSize {
display : none;
}

Open in new window

0
 
onBasicsAuthor Commented:
I've been playing with this for a while and am still unable to get it perfect.  If I resize the image, what CSS should I be using? I've managed to confuse myself.

Thanks Jeremy.
0
 
jeremyjared74Commented:
I will have to take a look. I did a few "hacks" to re-size the image and place things to clear space. I had some negative margin, and re-sized the image with css, and moved it's position with some padding I believe.

I see if I can help.
0
 
onBasicsAuthor Commented:
0
 
jeremyjared74Commented:
I'm not sure how to fix it without being able to update my changes. You might try placing the image as a background image instead of in the php content. Ty adding a div tag if you don't have an element that can hold the image. You could add a new div that wraps the header and #page, then give it a background image using the picture that is in the header.

I can't ask you for access, and I don't have a lot of time between projects. It's really something that someone needs to have access to. Me or any other seasoned designer could fix things up with access to the site, but it is just too difficult trying to use FireBug and test for different browsers since the changes I make in FF don't effect IE or chrome. Thus I have no way of knowing if they are working in those browsers. It's basically throwing darts in the dark.
0
 
onBasicsAuthor Commented:
Jeremy,
I'm very close.  The only remaining problem is the menus that drop down are behind a portion of the main text area.  Hover over "Parish" and "School" to see what I mean.  This seems like a really easy fix, but I can't figure it out.
http://www.saintmaryplano.com

Thanks!
0
 
jeremyjared74Commented:
You will need to experiment with the z-index on the menu items. Try to find what z-index's are set on other items so you don't repeat a value. If the overlapping items don't have a z-index, you need to set one lower that the one you use for the menu.
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 10
  • 10
Tackle projects and never again get stuck behind a technical roadblock.
Join Now