2nd column pushed to the bottom in Firefox
-
I know this has been asked before, and I’ve searched seemingly hundreds of posts looking for the answer that will help me but no luck so far.
When viewing my blog https://www.gregandlori.com/wordpress in IE and Safari, it looks great: the right hand column is flush with the header.
Firefox, on the other hand, being the superior browser, correctly interprets a mistake I’ve made somewhere in my css and pushes the right column to the bottom. I’ve done the math, and all the widths should be correct (bfly.gif is 257px wide)
I’m using the “simple two column theme” from https://www.unthemed.com and I’ve really only modified font sizes and some sidebar content.
Any thoughts? The css is below:
/*
Theme Name: Unthemed01-greg
Theme URI: https://unthemed.com/
Description: A simple 2 column wordpress theme
Version: 1.0
Author: unthemed
Author URI: https://unthemed.com/
*/
body {
background-image:url(images/bg.jpg);
background-repeat:repeat-x;
background-color:#12171D;
font:15px Verdana, Arial, Helvetica, sans-serif;
color:#FFFFFF;
text-align:center;
}
#wrap {
width:825px;
margin:10px auto;
text-align:left;
border-bottom: 1px #FFF solid;
padding-bottom:20px;
display:table;
}
#left {
width:485px;
float:left;
}
#header {}
#header h1{
font:32px “Times New Roman”, Times, serif;
margin:0;
padding:0;
font-weight:bolder;
}
#header h1 a{
text-decoration:none;
color:#FFFFFF;
}
#header h2{
margin:0;
padding:0;
font:12px Verdana, Arial, Helvetica, sans-serif;
font-weight:bolder;
}
#content {
padding-top:150px;
}
#content a {
text-decoration:none;
color:#FFF;
}
.post {
margin-bottom: 60px;
}
.post_info {
font-size:10px;
}
#content h2 {
font: 24px “Times New Roman”, Times, serif;
font-style:italic;
font-weight:bolder;
}
#content h2 a{
text-decoration:none;
color:#FFFFFF;
}
#right {
padding-top:240px;
width:260px;
float:right;
background-image:url(images/bfly.gif);
background-repeat:no-repeat;
}
#right h3 {
border-bottom: 1px #FFF solid;
font:18px “Times New Roman”, Times, serif;
font-weight:bolder;
font-style:italic;
padding-bottom: 4px;
}
#right .sidebar_item {
width:220px;
font:15px “Times New Roman”, Times, serif;
font-weight:bolder;
}
#right .sidebar_item a{
text-decoration:none;
color:#FFFFFF;
}
#footer {
clear:both;
}
#footer a{
text-decoration:none;
color:#FFF;
}
/*comments*/
#left textarea {
width:460px;
}
/*comments*/
- The topic ‘2nd column pushed to the bottom in Firefox’ is closed to new replies.