3 replies [Last post]
trc4949
Offline
Regular
Last seen: 2 years 16 weeks ago
Timezone: GMT-5
Joined: 2004-12-22
Posts: 24
Points: 7

something is screwed up in my css, at least when I view this page in IE6

http://www.psychic4u.net/20080325/the-ultimate-tool-for-the-psychic-healer/

everytime I use a blockquote, the text AFTER it becomes indented to the left a bit and If I use two blockquotes, the text after the second blockquote becomes indented to the left even MORE than after the first blockquote...

anyone have a clue what bug in my css is the cause?

html, body {
margin: 3px auto;
padding: 0px;
font-family: Verdana,Arial,Geneva, sans-serif;
font-size: 8px;
text-align: center;
background-color: #EFEDED;
cursor: auto;
color: #000000;
background:#F2F2F2 url(images/kubrickbgcolor.gif) repeat;
}
/*---------------------------- additions -------------------------------*/
.cmd-avatar {
clear: none;
border-right: #687F92 1px solid;
border-top: #687F92 1px solid;
display: inline;
float: left;
margin:0px;
padding:0px;
border-left: #687F92 1px solid;
border-bottom: #687F92 1px solid;
}
.feedburnerFlareBlock {
font-size:10px;
padding-bottom:0px;;
margin-bottom:0px;
margin-left: 0px;
padding-left:0px;
float:left;
text-align:left;
}
.headertext {
margin: 15px 0 0 100px;
padding:0;
}
.categoryheaders {
margin: 0px 10px 20px 10px;
padding: 5px;
width: 551px;
border: 1px solid #999999;
border-style: solid;
background-color:#D6E2EE;
}
.adblocksingle {
margin: 0px 10px 20px 10px;
padding: 5px;
width: 551px;
border: 1px solid #B40505;
border-style: dashed;
height:260px;
}
.adblock0 {
margin: 0px 10px 20px 10px;
padding: 5px;
width: 551px;
border: 1px solid #B40505;
border-style: dashed;
height:260px;
}
.adblock1 {
margin: 0px 10px 20px 10px;
padding: 5px;
width: 551px;
border: 1px solid #B40505;
border-style: dashed;
height:260px;
}
.adblock2 {
margin: 0px 10px 20px 10px;
padding: 5px;
width: 551px;
border: 1px solid #999999;
border-style: solid;
height:260px;
}
.adblock3 {
margin: 0px 10px 20px 10px;
padding: 5px;
width: 551px;
border: 1px solid #999999;
border-style: solid;
}
.adblock4 {
margin: 0px 10px 20px 10px;
padding: 5px;
width: 551px;
border: 1px solid #999999;
border-style: solid;
}
.descrip {
font-size: 12px;
font-weight: bold;
padding: 0 0 0 0;
font-style: italic;
}
.titlepos {
margin: 0 0 0 15px;
padding: 0 0 0 0;
}
.adtable {
border-top-width: thin;
border-top-style: dashed;
border-right-style: dashed;
border-top-color: #000000;
border-right-color: #000000;
border-bottom-color: #000000;
border-left-color: #000000;
border-bottom-width: thin;
border-bottom-style: dashed;
border-right-width: thin;
border-left-width: thin;
border-left-style: dashed;
}
.dateundertitle {
color: #6C82B5;
margin: 0 0 0 0;
padding: 2px 0 0 0;
font-weight: normal;
font-size: 10px;
}
#wp_quotes
{
width:70%;
padding-left:50px;
}
#wp_quotes div.wp_quotes_quote
{
}
#wp_quotes div.wp_quotes_author
{
text-align:right;
font-style: italic;
margin-top: 5px;
}

div.wp_quotepage
{
font-size: 14px;
width: 80%;
margin-left: 40px;
}
div.wp_quotepage_quote
{
}
div.wp_quotepage_author
{
margin-left: 40px;
font-style: italic;
}
hr.wp_quotepage_hr
{
width: 70%;
margin-top: 15px;
margin-bottom: 15px;
margin-left: 15px;
}
div.wpquotes_poweredby
{
text-align: center;
font-size: 0.8em;
margin-top: 12px;
}
/*--- controls indent of popular searches plugin ------*/
.ncol ul li{
margin-left: 10px;
padding:0;
}
/*-- end controls indent popular searches plugin ------*/
.boldheadingtext {
font-size:12px;
font-weight:bold;
margin-bottom:5px;
margin-left:0px;
}
.centerbold {
font-weight:bold;
text-align:center;
font-size:12px;
}
.relatedposts {
margin-left:10px;
padding:0;
}
/*-- nice archive css ------*/
.datearcAlt2 , .datearcAlt {
border-bottom: 1px solid #DCDCDC;
font-size: 1em;
padding: 0px;
width: 25%;
text-transform: lowercase;
}
.datearcAlt2 {
background: #E7E7E7;
}
.datearcAlt {
background: #F7F7F7;
}
.datearc {
border: 0px none;
padding: 0;
margin-left: auto;
margin-right: auto;
width: 166px;
margin-bottom:10px;
}
th {
font-size:14px;
}
/*-- end nice archive css ------*/

/*---------------------------- Links -------------------------------*/
a {
color: #0000FF;
text-decoration: none;
}
a:visited {
color: #800080;
text-decoration: none;
}
a:active {
color: red;
text-decoration: underline;
}

a:hover {
color: #000099;
text-decoration: underline;
}
a img {
border: none;
}
/*---------------------------- Images Structure -------------------------------*/

img.c { /*Now if you add the class "c" will center the img, "r" will float it to the right and yeah you guessed!... "l" will float it left.*/
display: block;
margin-left: auto;
margin-right: auto;
}
img.r {
float: right;
margin: 0 0 5px 15px;
}

img.l {
float: left;
margin: 0 15px 5px 0;
padding: 0;
}
.entry img {
padding: 6px;
max-width: 98%;
}
.page .entry img {
padding: 0px;
}

.entry a img {
border: 1px solid #FFFFFF;
padding: 6px;
max-width: 98%;
}
.entry a img:hover { /*-- does not work in IE --*/
border: 1px inset #000000;
background-color: #EFEDED;
}
/*---------------------------- General Html -------------------------------*/
hr {
display: none;
}
h1 {
font-face: verdana, arial;
font-size: 36px;
margin: 0 0 0 0px;
padding: 0 0 0 0;
}
h2, h3 {
font-weight: bold;
text-align: left;
margin: 0 0 0 0;
color: #000000;
}
.ncol h2{
border-bottom: 1px dashed #999999;
font-size: 12px;
padding-bottom: 0px;
background-color: #D6E2EE;
}
.ncol h1{
border-bottom: 1px dashed #999999;
font-size: 12px;
padding-bottom: 0px;
background-color: #D6E2EE;
margin-left: 0px;
width:541px;
}
.ncol .search h1 {
font-size:14px;
font-style:none;
border-bottom: none;
background-color:#FFFFFF;
text-align:center;
}

/*---------------------------- Category Html controls h1 tag ------*/
.page .ncol .category h1{
border-bottom: 1px dashed #999999;
font-size: 12px;
padding-bottom: 0px;
background-color: #D6E2EE;
margin-left: 20px;
width:541px;
text-align:center;
}
/*---------------------------- Category Html -------------------------------*/

.archived h2{
font-size: 11px;
padding:0;
margin:0;
}
.lnks h2{
border-bottom: 1px solid #CCCCCC;
font-size: 12px;
width: 80%;
}
.narchives h3{
margin: 25px 0px 10px 0px;
}
.wcol h2{
border-bottom: 1px solid #CCCCCC;
font-size: 12px;
padding-bottom: 0px;
margin-top: 0px;

}
.sidebar h2{
border-bottom: 1px solid #000000;
text-align: left;
font-size: 13px;
margin: 0 0 0 10px;
background-color:#C0A2DF;
}
h2 a:visited, h3 a:visited{
color: #800080;
}
h2 a, h3 a {
color: #0000FF;
}
h2 a:active, h3 a:active {
color: red;
}

h2 a:hover {
color: #000099;
}
h3{
font-size: 13px;
}
blockquote {
background-color:#F7F7F7;
border-left: 5px solid #94A6BD;
padding:10px 20px;
}
blockquote:hover {
background: #FFFFFF;
}
code, pre, kbd {
font-family: 'Courier New', Courier, mono, Fixed, sans-serif;
font-size: 1.1em;
display: block;
}
small {
font-size: 12px;
line-height: 1.5em;
font-style:italic;
}
acronym, abbr {
letter-spacing: .07em;
border-bottom: 1px dashed #993333;
cursor: help;
}
strike, del {
text-decoration: line-through;
}
p {
margin-left:5px;
margin-right:5px;
}

/*---------------------------- Page Navigation -------------------------------*/
.navigation {
margin: 0px 10px 0px 10px;
padding: 0 0 10px 0;
font-weight: normal;
font-size: 10px;
background-color:#FFFFFF;
}
.ncol .navigation {
margin: 15px 0px;
font-size: 11px;
}
.ar { /*This way you can use a simple class="ar"/"al"/"ac" to get an objet floated or centered.*/
float: right;
}
.al {
float: left
}
.ac {
text-align: center;
margin-left: auto;
margin-right: auto;
}
/*---------------------------- Content -------------------------------*/
#content{
margin: 0px auto;
width: 780px;
font-size: 11px;
text-align: left;
}
/*----------------------------Top Bar -------------------------------*/
#topmostbar {
margin: 1px 0px 0px 0px;
padding: 0px 0px 7px 0px;
width: 778px;
height: 92px;
background-color: #FFFFFF;
border-top:none;
border-bottom:none;
border-right:1px solid #000000;
border-left:1px solid #000000;
font-family: Verdana, Geneva, Arial, sans-serif;
font-size: 36px;
font-weight: bold;
background: #FFFFFF url(images/headerback.gif) no-repeat;
}
#topmostbar a {
color: #000000;
text-decoration: none;
}
#topbar{
margin: 4px 0 1px 0;
padding: 0px;
width: 778px;
height: 25px;
background-color: #FFFFFF;
border-top:1px solid #CCCCCC;
border-bottom:1px solid #CCCCCC;
border-right:1px solid #000000;
border-left:1px solid #000000;
font-family: Verdana, Geneva, Arial, sans-serif;
line-height: 17px;
font-size: 10px;
}
.navbar{
margin: 0px auto;
padding: 3px 1px 2px 1px;
}
.navbar ul{
display: inline;
list-style-type: none;
}
.navbar li{
display: inline;
list-style-type: none;
}
.navbar a, .navbar a:visited {
cursor: pointer;
float: left;
font-weight: normal;
margin: 0px 10px 3px 8px;
}
.navbar a:hover{
color: #336699;
}
/*---------------------------- Top Search Form -------------------------------*/
.topsform {
margin: -1px 2px 3px 0px;
padding: 0px;
width: 220px;
height: 16px;
background-color: #FFFFFF;
border:1px solid #999999;
float: right;
}
.t-s{
margin: 0px auto;
padding: 0px;
font-family: Verdana, Geneva, Arial, sans-serif;
color: #000000;
font-size: 11px;
width: 67%;
height: 100%;
border: none;
background-color: #FFF;
}
.topsformsubmit{
margin: 0px auto;
padding: 0px;
font-family: Verdana, Geneva, Arial, sans-serif;
color: #000000;
font-size: 10px;
font-weight: bold;
width: 30%;
height: 100%;
background-color: #FBF8D2;
border: none;
border-left:1px solid #CCCCCC;
cursor: pointer;
}
.topsformsubmit:hover{ /*-- does not work in IE --*/
background-color: #EFEDED;
color: #336699;
}
.topsform2 {
margin: 15px 0 10px 0;
padding: 5px;
width: 160px;
height: 100%;
background-color: #C3D9FF;
border:1px solid #999999;
float: left;
text-align:left;
}
.t-s2 {
margin: 0px auto;
padding: 0px;
font-family: Verdana, Geneva, Arial, sans-serif;
color: #000000;
font-size: 12px;
width: 100%;
height: 100%;
background-color: #FFF;
}
.topsformsubmit2 {
margin: 0px auto;
padding: 0px;
font-family: Verdana, Geneva, Arial, sans-serif;
color: #000000;
font-size: 10px;
font-weight: bold;
width: 60%;
height: 100%;
background-color: #FBF8D2;
border-left:1px solid #CCCCCC;
cursor: pointer;
}
/*---------------------------- Header -------------------------------*/
/*--Just drop a 778px*98px image named 'header.png' in the theme folder an it will be displayed in your blog header---*/
.header {
margin: 3px 0 3px 0px;
padding: 0px;
display: block;
width: 778px;
height:98px;
background-color: #FFFFFF;
border: 1px solid #CCCCCC;
cursor: auto;
clear:both;
text-align:center;
}
/*---------------------------- Page -------------------------------*/
.page {
width: 778px;
margin: 1px 0px;
padding: 0px;
background-color: #FFD7CF;
border-top:1px solid #CCCCCC;
border-bottom:1px solid #CCCCCC;
border-right:1px solid #000000;
border-left:1px solid #000000;
text-align: left;
float: left;
}


/*---------------------------- Narrow Column -------------------------------*/

.ncol {
padding: 24px 0px 40px 0px;
width: 584px;
background-color: #FFFFFF;
float:right;
}
/*---------------------------- Wide Column -------------------------------*/

.wcol {
margin: 0px auto;
width: 778px;
padding: 40px 0px 0px 0px;
line-height: 1.5em;
background-color: #FFFFFF;
}
/*---------------------------- Post Structure -------------------------------*/
/*----- note removed text align justify in the post css below for proper sidebar formatting ----*/
.post {
border: 1px solid #999999;
margin: 0px 10px 20px 10px;

padding: 10px;
width: 541px;
background-color: #FFFFFF;
}
.archived {
padding: 0px 0px 0px 0px;
}

.archived .post {
margin: 10px 10px 20px 10px;
border-right:none;
border-left:none;
border-top:none;
padding:10px;
width: 541px;
border: 1px solid #999999;
}

.postmetadata {
width: 95%;
margin: 15px 0px 0px 0px;
padding: 3px;
border-top: 1px solid #CCCCCC;
color: #999999;
text-align: left;
line-height: 17px;

font-size: 10px;
}
.wcol .postmetadata {
width: 100%;
margin: 25px 0px 30px 0px;
}
.entry {
font-size: 11px;
line-height: 1.3em;
font-style: Verdana,Arial, Geneva, sans-serif;
}
.entry a {
font-weight: normal;
}
.entry ol li {
list-style: decimal outside;
}
.entry ul li {
list-style-type: square;
}
.entry form {
text-align: left;
}
.entry input { /* For password-protected posts */
margin: 2px auto;
font-size: 9px;
padding: 0px;
background-color: #FFFFFF;

border:1px solid #CCCCCC;
}
.entry input[value="Submit"] {
font-size: 9px;
cursor: pointer;
}
.entry input[value="Submit"]:hover{ /*-- does not work in IE --*/
background-color: #EFEDED;
}
/*---------------------------- Sidebar -------------------------------*/
.sidebar {
width: 194px;
padding: 24px 0px 40px 0px;
background:#FFD7CF url(images/sidebarbg.jpg) repeat-x top;
float:left;
font-size: 11px;
overflow:hidden;
}
.sidebar h2.lnkname {
margin: 0px 0px -5px 5px;
text-align: left;
font-size: 10px;
border: none;
}
.sidebar ul {
margin: 0px 15px 30px 0px;
padding: 0px;
list-style-type: none;
list-style-image: none;
}
.sidebar ul li {
list-style-type: none;
list-style-image: none;
line-height: 14px;
}
.sidebar ul li ul {
margin: 10px 0px 20px 10px;
list-style-type: none;
list-style-image: none;
}
.sidebar ul li ul li {
color: #000000;
list-style-type: none;
list-style-image: none;
border-bottom: 1px dotted #333333;
}
.sidebar ul li ul li a{
font-weight: normal;
}
/*---------------------------- Search box for error-404 pages -------------------------------*/
.searchbox{
margin: 0px auto;
margin-top: 30px;
padding: 0px;
display: block;
width: 500px;
height: 50px;
background: #EFEDED;
border:1px solid #CCCCCC;
}
.searchbox #searchform {
background: #FFFFFF;
margin: 14px auto;
width: 400px;
padding: 0px;
border: 1px solid #CCCCCC;
}
.searchbox #searchform #s{
margin: 0px auto;
padding: 1px;
font-family: Verdana, Geneva, Arial, sans-serif;
color: #666666;
font-size: 10px;
width: 298px;
height: 100%;
border: none;
background-color: #FFFFFF;
}
.searchbox #searchform #searchsubmit{
border: none;
margin: 0px auto;
padding: 2px 0px;
font-family: Verdana, Geneva, Arial, sans-serif;
color: #000000;
font-size: 10px;
font-weight: bold;
width: 96px;
height: 100%;
background-color: #FFFFFF;
border-left:1px solid #CCCCCC;
cursor: pointer;
}
.searchbox #searchform #searchsubmit:hover{ /*-- does not work in IE --*/
background-color: #EFEDED;
color: #336699;
}
/*---------------------------- Comments -------------------------------*/
.comarea{
font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
line-height: 17px;
margin-left:40px;
}
.comol{

margin: 20px 0px 40px 0px;
text-align: left;
font-weight: bold;
list-style-type: upper-roman;
}
.comli{
border-left: 1px solid #CCCCCC;
border-bottom: 1px solid #CCCCCC;
text-align: left;
margin: 25px 0px 20px 40px;
padding: 4px;
min-height: 90px; /*-- does not work in IE --*/
width: 350px;
}
.comauth{

border-bottom: 1px solid #CCCCCC;
width: 70%;
font-size: 11px;
font-weight: bold;
padding: 0px 0px 2px 2px;
}
.mod {
color: #990033;
}
.comli .cmeta {
margin: 1px 0px 5px 2px;
border: none;
font-size: 10px;
font-weight: normal;
}

.comtxt{

margin: 0px 0px 0px 5px;
font-size: 11px;
font-weight: normal;
text-align: left;

}
.preview {
text-align: left;
margin-top: 20px;
list-style: none;
width: 350px;
}
.preview ul {
list-style: none;
margin: 0px;
padding: 0px;
}
.preview ul li {
list-style: none;
border-left: 1px solid #CCCCCC;
border-bottom: 1px solid #CCCCCC;
text-align: left;
padding: 4px;
min-height: 90px; /*-- does not work in IE --*/
}
#TextDisplay { /*Live Preview of Comments */
margin: 5px 0px 0px 5px;
font-size: 9px;
font-weight: normal;
text-align: left;
}
/*---------------------------- Comment Form -------------------------------*/
#commentform {
margin: 15px 0px 30px 71px;
}
#commentform input {
font: 0.9em 'Lucida Grande', Verdana, Arial, Sans-Serif;
width: 170px;
padding: 2px;
margin: 5px 5px 1px 0;
border: 1px solid #CCCCCC;
border-right: 3px solid #CCCCCC;
}
#commentform textarea {
font: 0.9em 'Lucida Grande', Verdana, Arial, Sans-Serif;
width: 350px;
padding: 2px;
border: 1px solid #CCCCCC;
border-right: 3px solid #CCCCCC;
}
#commentform #submit {
width: 350px;
padding: 2px;
background: #FFFFFF;
text-align: center;
border: 1px solid #CCCCCC;
border-right: 3px solid #CCCCCC;
font-weight: bold;
cursor: pointer;
}

#commentform #submit:hover { /*-- does not work in IE --*/
background-color: #EFEDED;
}
/*---------------------------- Footer -------------------------------*/

.footer {
font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
font-size: 0.8em;
margin: 1px 0px;
padding: 0px;
width: 778px;
height: 120px;
background-color: #FFFFFF;
border-top:1px solid #CCCCCC;
border-bottom:1px solid #CCCCCC;
border-right:1px solid #000000;
border-left:1px solid #000000;
clear:both;
}
.footer2 {
font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
font-size: 0.8em;
margin: 1px 0px;
padding: 0px;
width: 778px;
line-height:16px;
height: 45px;
background-color: #FFFFFF;
border-top:1px solid #CCCCCC;
border-bottom:1px solid #CCCCCC;
border-right:1px solid #000000;
border-left:1px solid #000000;
clear:both;
}

.powered {
margin: 12px auto;
margin-right: 10px;
padding-left: 20px;
text-align: center;
}
.powered a {
font-weight: bold;
}
/*---------------------------- Go-up -------------------------------*/

.ttrack a, .ttrack a:visited, .ttrack a:hover{
color: #FFFFFF;
font-size: 0px;
}
/*---------------------------- narchives Template -------------------------------*/
.narchives {
margin-top: 20px;
}
.narchives a {
font-weight: bold;
}
.narchives input {
cursor: pointer;
}
/*---------------------------- Links Template -------------------------------*/
.lnks {
font-size: 10px;
padding: 8px 0px 0px 30px;
}
.lnks a {
font-weight: bold;
}
.lnks ul li {
margin: 0px 0px 0px 4px;
color: #666666;
list-style-type: square;
list-style-image: none;
}
.lnks li {
list-style-type: none;
list-style-image: none;
}

//mod edit: Moved. Site checks is for complete or near complete site critiques. --gary.turner

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 2 years 4 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

this appears to be the magic

this appears to be the magic creeping text bug.

Where John talks about the Holly hack, use {zoom: 1;} to test, which will trigger hasLayout (which nobody knew much about back then).

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

trc4949
Offline
Regular
Last seen: 2 years 16 weeks ago
Timezone: GMT-5
Joined: 2004-12-22
Posts: 24
Points: 7

thank you

wow, would have NEVER figured this one on my own..

big thank you!

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 2 years 4 weeks ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

That's why at least one

That's why at least one member refers to "the crusty old guys who know things". Laughing out loud After you've spent some time with this, you start to recognize symptoms. We don't remember all the fixes, but we pretty well know where to find them.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.