Contextual Pop-up: Firefox vs. IE

Jan 03, 2011 16:46

Community: tmrevolutionist
Account: Paid
Issue: Yet another Firefox vs. IE problem. I'm having a problem with the contextual pop-up. In Firefox it looks EXACTLY the way I want it to, but in IE...



...it's all stretched out. DO NOT WANT. The problem is somewhere in my CSS, but for the life of me I cannot figure it out (of course, I COULD learn to live with it, but...). My journal uses some of the same code, but the contextual pop-up is just fine in IE.

CSS:

/* revolutionist - layout by yoshibelle @ yoshibelle.livejournal.com (basic, plus, paid, yeah yeah yeah) */

body {
background:#FFFFFF url(http://pics.livejournal.com/yoshibelletest/pic/00003bbt) repeat fixed 0 0;
color:#000000;
font-family:Arial;
font-size:11px;
margin:20px 0;
text-align:center;
}
a, a:link, a:visited {
color:#708fa7;
text-decoration:none;
}
a:hover {
color:#333e82;
text-decoration:underline;
}
p, td {
font-size:11px;
}
blockquote {
background:transparent url(http://i36.tinypic.com/v6hl60.png) repeat scroll 0 0;
border-left:2px solid #d0d0d0;
font-size:11px;
padding:10px;
}
b, u {
color:#537da9;
}
i, s {
color:#104656;
}
code, kbd, pre, tt {
border:1px dashed #d0d0d0;
color:#8d9a9f;
display:block;
font-family:monospace;
padding:4px;
}
.ljuser a b {
font-family:Georgia;
font-style:italic;
font-weight:normal;
}

.ljuser a:hover {
color:#333e82;
text-decoration:none;
}
#content {
background-color:#EFF2FC;
border:3px solid #E0E0E0;
left:40px;
margin:0 auto;
padding-top:0;
position:relative;
width:700px;
}
#maincontent {
background-color:#FFFFFF;
color:#000000;
font-family:Arial;
font-size:11px;
margin:auto 0;
position:relative;
text-align:left;
width:700px;
}

#maincontent .skiplinks img {
border-width: 0;
}
.subcontent {
background-color:#FFFFFF;
margin:2px 5px 20px;
}
#sidebar {
background-color:#FFFFFF;
border:2px solid #8D9A9F;
color:#000000;
float:left;
font-family:Arial;
font-size:11px;
margin:-435px auto 0 -175px !important;
padding-top:9px;
position:relative;
text-align:left;
width:160px;
z-index:100;
}
#sidebar.sidebar2 {
background-color:#FFFFFF;
border:2px solid #8D9A9F;
color:#000000;
float:left;
font-family:Arial;
font-size:11px;
margin:275px auto 0 -175px !important;
padding-top:9px;
position:absolute;
text-align:left;
width:160px;
z-index:100;
}
#header {
background-color:transparent;
background-image:url("http://pics.livejournal.com/yoshibelletest/pic/00001z1s");
background-repeat:no-repeat;
color:#000000;
font-family:Georgia;
font-size:18px;
font-weight:lighter;
height:431px;
margin-top:0;
padding:1px 3px;
position:relative;
text-align:center;
text-transform:lowercase;
width:700px;
}
#footer {
background-color:transparent;
clear:both;
color:#5e6b9f;
font-family:Georgia;
font-size:14px;
font-style:italic;
font-weight:lighter;
letter-spacing:1px;
text-align:center;
text-transform:lowercase;
z-index:100;
}
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link,

div#footer a:visited {
color:#000000;
}
div#header a:hover, div#footer a:hover {
color:#0775a9;
text-decoration:none;
}
ul.navheader {
letter-spacing: 1px;
float:right;
}
ul.navheader li {
background-color:transparent;
border:none;
display:block;
left:80px;
list-style-type:none;
padding:7px;
position:relative;
}
ul.navheader li:hover {
font-style:italic;
}
.title {
display:none;
font-family:"Verdana",sans-serif;
font-size:11px;
font-weight:normal;
line-height:200%;
top:10px;
}
.subtitle {
display:none;
font-family:"Verdana",sans-serif;
font-size:11px;
font-weight:normal;
top:10px;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited {
}
div#sidebar a:hover {
color:#333e82;
text-decoration:none;
}
.defaultuserpic {
text-align:center;
}
.sbarheader {
padding:0 5px;
}
.sbarbody {
padding:0 10px;
}
.sbarbody2 {
padding:0 10px;
}
#sidebar_summary li.sbaritem {
border-bottom:1px solid #FFFFFF;
margin:0 2px;
padding:3px 0;
}
table.calendar {
margin-left:auto;
margin-right:auto;
}
.sbarcalendar {
font-family:Arial;
font-size:11px;
text-align:center;
}
.sbarcalendarposts {
font-family:Georgia;
font-size:11px;
font-weight:bold;
text-align:center;
}
ul.sbarlist {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin-left:0;
padding-left:0;
}
li.sbaritem {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
padding-left:0px;
}
.tagcloud {height:300px;
overflow-y:scroll;
overflow-x:hidden;
list-style-type:none;
list-style-type:none;
padding-left:15px;
}
li.sbartitle {
background-color:transparent;
border-bottom:3px dotted #B0C7F5;
color:#6699FF;
font-family:Georgia;
font-size:18px;
font-style:italic;
font-weight:lighter;
list-style:none outside none;
margin-bottom:10px;
margin-top:10px;
padding:0 5px 0 0;
text-align:right;
text-transform:lowercase;
}
.subcontent {
margin:2px 5px 20px;
}
.entry {
background-color:#FFFFFF;
color:#000000;
font-family:Arial;
font-size:11px;
padding:20px;
text-align:justify;
}
.entry ul li {
margin-left:15px;
padding-left:5px;
}
.entry ol li {
margin-left:15px;
padding-left:5px;
}
.userpic {
background-color:#FFFFFF;
border:1px solid #FFFFFF;
float:left;
margin-right:15px;
padding:10px;
position:inherit;
z-index:15;
}
element.style {
background-color:#FFFFFF;
text-align:center;
}
.userpicfriends {
background-color:#FFFFFF;
border:1px solid #FFFFFF;
float:left;
font-family:Georgia;
font-size:11px;
margin-right:5px;
margin-top:0;
padding:20px;
position:relative;
text-align:center;
z-index:15;
}
.date {
color:#000000;
font-family:Georgia;
font-size:11px;
font-style:italic;
font-weight:normal;
line-height:200%;
text-align:left;
text-transform:lowercase;
top:5px;
}
.subject {
background-color:transparent;
color:#000000;
font-family:georgia;
font-size:18px;
letter-spacing:0;
line-height:100%;
margin-top:-10px;
padding:10px;
text-align:left;
}
.subject:first-letter {font-family:georgia;
color: #6ca1b1;
font-size:24px;
font-weight:bold;
text-transform:uppercase;
}
.subject a, .subject a:link, .subject a:visited {
color:#000000;
text-decoration:none;
}
.subject a:hover {
color:#baafaf;
text-decoration:none;
}
.datesubject {
background-color:transparent;
}
.currents {
text-align: right;
margin:15px 10px 5px -15px;
width: 100%;
}
.currents table {
position: relative;
right: 0px;
margin-left: auto;
}
.comments {
background-color:#FFFFFF;
font-family:Georgia;
font-size:11px;
padding:0 5px;
position:relative;
text-align:right;
text-transform:lowercase;
top:15px;
}
div.comments a, div.comments a:link, div.comments a:visited {
color:#000000;
}
div.comments a:hover {
color:#BAAFAF;
text-decoration:none;
}
.datesubjectcomment {
-moz-border-radius:0 10px 0 0;
background-color:#ddeeff;
margin-top:20px;
padding:5px;
width:98.6%;
}
.userpiccomment {
background-color:transparent;
border:none;
float:left;
margin:-5px -7px;
padding-bottom:9px;
padding-right:20px;
position:relative;
z-index:15;
}
.box {
border-color:#FFFFFF;
border-style:solid;
border-width:0 0 0;
clear:left;
padding:0 35px;
}
#qrform table {
border-width: 0px !important;
}
input {
background-color:#transparent;
background:url(http://i36.tinypic.com/v6hl60.png) repeat scroll 0 0;
border:0px solid #FFFFFF;
color:#4F4D65;
}

textarea {
background-color:#transparent;
background:url(http://i36.tinypic.com/v6hl60.png) repeat scroll 0 0;
border:0px solid #FFFFFF;
color:#4F4D65;
height:300px;
width:300px;
}

textarea.textbox {
height:250px;
width:400px;
}

.reply {
background-color:#DDEFFF;
color:#4F4D65;
font-family:Arial;
font-size:11px;
line-height:125%;
margin:20px 30px 10px;
padding:25px 10px 10px;
position:relative;
text-align:left;
}
.replytosubject {
font-weight:bold;
}
.commentreply {
color:#4F4D65;
font-family:Arial;
font-size:11px;
margin-top:5px;
position:relative;
text-align:justify;
}
.commentbox {background-color:#FFFFFF;
border:none;
margin:20px -6px;
padding-bottom:20px;
min-height:110px;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color:#5DABAA;
}
.datesubjectcomment a:hover {
color:#779595;
}
.commentboxpartial {
-moz-border-radius:10px 10px 10px 10px;
background-color:#DDEFFF;
border:1px solid #FFFFFF;
margin:10px;
padding:10px;
}
.commentinfo {
background-color:#DDEFFF;
margin-top:10px;
width:100%;
}
ul.year {
background-color:transparent;
color:#000000;
font-family:Georgia,Times New Roman,Times,serif;
font-size:18px;
letter-spacing:1px;
text-align:center;
}
ul.year li {
display:inline;
}
table.yeartable {
margin-left:auto;
margin-right:auto;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border:0 solid #FFFFFF;
text-align:center;
}
table.yeartable td.yearday {
color:#000000;
font-family:Georgia,Times New Roman,Times,serif;
font-size:14px;
font-weight:bold
text-align:center;
text-transform:lowercase;
}
td.yearmonth {
border-style:none;
color:#000000;
font-family:Georgia,Times New Roman,Times,serif;
font-weight:bold;
font-size:14px;
text-transform:lowercase;
}
ul.navfooter {
margin:0;
padding:0;
}
ul.navfooter li {
display:inline;
margin:0 5px;
}
.clearfoot {
clear:both;
}
.clear {
display:none;
}
.skiplinks {
font-size:9px;
padding:10px;
text-align:center;
text-transform:lowercase;
}
.headerimage {
}
.separator {
height:20px;
}
* html div.subcontent {
clear:none;
height:1%;
}
* html div#commentform.box {
background-color:#D3DCFC;
border:1px solid #FFFFFF;
position:absolute;
}

/* TINY ICONS */

img[src*="icon_protected.gif"], img[src*="icon_private.gif"], img[src*="icon_groups.gif"], .ljuser img [src*="syndicated.gif"], .ljuser img[src*="newsinfo.gif"], .ljuser img[src*="partnercomm.gif"], .ljuser img [src*="sponcomm.gif"], img[src*="btn_del.gif"], img[src*="btn_edit.gif"], img[src*="btn_scr.gif"], img [src*="btn_unscr.gif"], img[src*="btn_freeze.gif"], img[src*="btn_unfreeze.gif"], img[src*="btn_track.gif"], img [src*="btn_tracking.gif"], img[src*="btn_tracking_thread.gif"], img[src*="anonymous.gif"], img[src*="openid-profile.gif"], img[src*="userinfo.gif"], img[src*="talk/none.gif"], img[src*="help.gif"], img[src*="pencil.gif"] {
background:transparent none no-repeat scroll 0 0;
height:0;
width:0;
}
.subject img {
vertical-align:middle !important;
}
img[src*="icon_protected.gif"] {
background-image:url(http://i36.tinypic.com/2r6nyop.png);
padding:0 5px 16px 16px !important;
}
img[src*="icon_private.gif"] {
background-image:url(http://i34.tinypic.com/riro5e.png);
padding:0 5px 16px 16px !important;
}
img[src*="icon_groups.gif"] {
background-image:url(http://i35.tinypic.com/23wsh13.png);
padding:0 0 16px 16px !important;
}
.ljuser img[src*="syndicated.gif"] {
background-image:url(http://i38.tinypic.com/5yccx3.png) !important;
padding:0 0 16px 16px !important;
}
.ljuser img[src*="newsinfo.gif"] {
background-image:url(http://i36.tinypic.com/2q3rd7d.png) !important;
padding:0 0 16px 16px !important;
}
.ljuser img[src*="partnercomm.gif"] {
background-image:url(http://i37.tinypic.com/20rqzvt.png) !important;
padding:0 0 16px 16px !important;
}
.ljuser img[src*="sponcomm.gif"] {
background-image:url(http://i34.tinypic.com/fjq6c6.png) !important;
padding:0 0 16px 16px !important;
}
.ljuser img {
background:transparent url() no-repeat scroll 0 0;
height:0;
padding:16px 16px 0 2px !important;
vertical-align:baseline !important;
width:0;
}
.ljuser img[src*="userinfo.gif"] {
background:transparent url(http://i53.tinypic.com/eafu9x.gif) no-repeat scroll 0 0 !important;
padding:10px 10px 0 2px !important;
}
.ljuser img[src*="community.gif"] {
background:transparent url(http://i56.tinypic.com/2d93ds4.gif) no-repeat scroll left center !important;
padding:14px 14px 0 2px !important;
}
img[src*="btn_del.gif"] {
background-image:url(http://i33.tinypic.com/211j7d0.png);
padding:0 0 16px 16px !important;
}
img[src*="btn_scr.gif"] {
background-image:url(http://i33.tinypic.com/2n741g7.png);
padding:0 0 16px 16px !important;
}
img[src*="btn_unscr.gif"] {
background-image:url(http://i37.tinypic.com/2h3rjuc.png);
padding:0 0 16px 16px !important;
}
img[src*="btn_freeze.gif"] {
background-image:url(http://i35.tinypic.com/25td9p2.png);
padding:0 0 16px 16px !important;
}
img[src*="btn_unfreeze.gif"] {
background-image:url(http://i35.tinypic.com/334s16t.png);
padding:0 0 16px 16px !important;
}
img[src*="btn_track.gif"] {
background-image:url(http://i35.tinypic.com/29kow36.png);
padding:0 0 16px 16px !important;
}
img[src*="btn_tracking.gif"] {
background-image:url(http://i33.tinypic.com/2eq50gn.png);
padding:0 0 16px 16px !important;
}
img[src*="btn_tracking_thread.gif"] {
background-image:url(http://i33.tinypic.com/ic7ajm.png);
padding:0 0 16px 16px !important;
}
img[src*="anonymous.gif"] {
background-image:url(http://i35.tinypic.com/2448ugj.png);
padding:0 0 16px 16px !important;
}
img[src*="openid-profile.gif"] {
background-image:url(http://i33.tinypic.com/2eyj39d.png);
padding:0 0 16px 16px !important;
}
img[src*="userinfo.gif"] {
background-image:url(http://i53.tinypic.com/eafu9x.gif);
padding:0 0 10px 10px !important;
}
img[src*="talk/none.gif"] {
background-image:url(http://i34.tinypic.com/35hr0qd.png);
padding:0 0 16px 16px !important;
}
img[src*="help.gif"] {
background-image:url(http://i37.tinypic.com/2gydmjs.png);
padding:0 0 16px 16px !important;
}
img[src*="pencil.gif"] {
background-image:url(http://i38.tinypic.com/jb1ohj.png);
padding:0 0 16px 16px !important;
}
img[src*="btn_edit.gif"] {
background-image:url(http://i38.tinypic.com/jb1ohj.png);
padding:0 0 16px 16px !important;
}

/* CONTROL STRIP */

table#lj_controlstrip td {
background:transparent url(http://pics.livejournal.com/yoshibelletest/pic/00003bbt) repeat fixed 0 0;
color:#000000;
text-transform:lowercase;
}
#lj_controlstrip input {
background-color:#FFFFFF;
border:1px solid #FFFFFF;
color:#555555;
}
#lj_controlstrip a {
color:#537DA9;
}
#lj_controlstrip_statustext {
color:#1d4ea6;
}
#lj_controlstrip .ljuser a b {
color:#537DA9;
}
#lj_controlstrip_userpic {
display:none;
}
#lj_controlstrip_user, #lj_controlstrip_login, #lj_controlstrip_loggedout_userpic, #lj_controlstrip_actionlinks {
border:0px solid;
}
#lj_controlstrip select, #lj_controlstrip input#xc_user, #lj_controlstrip input#xc_password, #lj_controlstrip input#xc_remember {
background-color:#FFFFFF;
font-family:Arial,sans-serif;
font-size:11px;
line-height:16.5px;
margin:0;
padding:0;
}

/* CONTEXTUAL POP-UP */

div.ContextualPopup {font: normal 9px "Arial" !important; margin: 10px; text-align: left;
}
div.ContextualPopup div.Inner {
background:transparent none repeat scroll 0 0 !important;
border:0 none;
color:#1d4ea6 !important;
padding:10px;
width:300px;
}
div.ContextualPopup .Userpic {
background:#FFFFFF none repeat scroll 0 0;
border:1px dashed #1d4ea6;
margin-left:12px;
padding:4px;
height:100%;
}
div.ContextualPopup .Content {
background:#FFFFFF none repeat scroll 0 0;
border:1px dashed #1d4ea6;
margin:4px 80px 4px 4px;
padding:5px;
}
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
color:#708FA7 !important;
font-weight:normal;
text-decoration:none !important;
}
div.ContextualPopup .Relation {
font-family:Georgia,Times New Roman,Times,serif;
font-size:12px;
text-transform:lowercase;
}

/* NAVIGATION FOOTER */
div#footer a{font-size:0}
div#footer li a{padding: 18px;background:transparent url(http://i55.tinypic.com/2d7foyw.png) no-repeat scroll 50% 0}
div#footer li + li a{padding: 18px;background:transparent url(http://i51.tinypic.com/29ifky.png) no-repeat scroll 50% 0}

(created from scratch; this is probably why it's been so problematic. rofl)

In addition, here's our theme layer: http://www.livejournal.com/customize/advanced/layerbrowse.bml?id=25626210
I doubt that that's causing any contextual pop-up problems, but...

Many thanks in advance! I'm close to pulling my hair out here D:

EDIT: I have a second question: I'm using the second sidebar override, and I'm wondering if there's any way to properly rearrange the code in the theme layer so that our second sidebar prints immediately after the first without having to set the top margin to some huge amount, as I have it now (275px).

lj and browser issues, sidebar, misc, paid accounts

Previous post Next post
Up