In some of my posts (not all of them), the first image keeps floating right event though I have put in <center></center> tags. Can someone help me figure out why this is happening. Example here: http://renegadechicks.com/twelve-inspiring-centerpieces-3
Below is my CSS:
/*
Theme Name: StyleWeekly
Theme URI: http://cloverthemes.com/
Author: http://cloverthemes.com/
Author URI: http://cloverthemes.com/
Description: Style Weekly
Version: 1.2
Tags: magazine, beauty, style, fashion
*/
/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------webs------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pbackgre,
a, abbr, acronym, address, big, cite, code,
del, dfn, font, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section,fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, br {
border: 0;
font-family: inherit;
font-size: 100%;
font-style: inherit;
font-weight: inherit;
margin: 0;
outline: 0;
padding: 0;
vertical-align: baseline;
}
:focus { /* remember to define focus styles! */
outline: 0;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
table { /* tables still need 'cellspacing="0"' in the markup */
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
font-weight: normal;
text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
a img {
border:5px solid #FBDDDF;
}
img.centered, .aligncenter, div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}
img.alignleft {
padding: 4px;im
margin: 0 7px 2px 0;
display: inline;
}
.alignright {
float: right;
}
.alignleft {
float: left;
}
.box img { display: block; margin: auto; }
img {
display: block;
width: auto;
margin: auto;
}
small {font-size:11px;}
/* Floating
---------------------------------------------------------------- */
.alignleft {
float: left;
margin: 0 10px 10px 0;
}
.alignright {
float: right;
margin: 0 0 0 10px;
}
.aligncenter {
display: block;
margin: 0 auto 10px;
}
.left{float:left;}
.right{float:right;}
/* Clear Floats
---------------------------------------------------------------- */
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
* html .clearfix { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
/* Global
-------------------------------------------------------------- */
body {
color: #444;
font-family: "Segoe UI","Helvetica","Arial",sans-serif;
font-size: 16px;
line-height: 1.5em;
background: #000 url("images/graphicBg.jpg") no-repeat top center;
}
#inner {
background-color: #fff;
border: 3px solid #F10C6A;
padding: 20px}
#logos {
display:none;
}
#linkwithin_logo_0 {
display: none;
padding-below: 5px;
}
#post-131 .st_facebook_large, #post-131 .st_twitter_large, #post-131 .st_pinterest_large, #post-131 .st_linkedin_large, #post-131 .st_email_large, #post-131 .st_sharethis_large, #post-131 .st_fblike_large {display: none;}
.stMainServices st-facebook-counter {
padding-bottom:15px;
}
.c-1 {
float: left; padding-top: 20px;width:650px}
.c-1 .bd {
background: none}
h1,h2,h3,h4,h5,h6 {color:#cc0066; font-weight: normal;font-family:Georgia,"Times New Roman",Times,serif; padding-bottom: 10px;
}
h1 {
font-size: 40px;
}
h2 {
font-size: 30px;
}
h3 {
font-size: 30px; padding-top: 5px;
}
h4 {
font-size: 30px;
}
h5,h6 {
font-size: 30px;
}
pre,code,kbd,samp,tt {mos
font: 16px/1.385 "Courier New", Monospace, serif;
}
/* Hyperlinks
------------------------------------------------------------ */
a,
a:visited {
}
a:hover {
text-decoration: underline;
}
a img {
border: 5px solid #FBDDDF;
}
.imagelogo {
border:none;
}
h1 a,h2 a,h3 a,h4 a, h5 a, h6 a {
text-decoration: none; color: #
}
h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover {
text-decoration: underline; color: #0AC6F5;
}
/* Input Form & TextArea
---------------------------------------------------------------- */
input, textarea {
border-color: #ccc #efefef #efefef #ccc;
border-width: 1px;
border-style: solid;
color: #777;
padding: 6px;
}
input:focus {
background: #ffffff;
}
/* Color
-------------------------------------------------------------- */
a,
a:visited, #logo .site-title a {
color: #cc0066;border:none !important;
}
#nav, #nav li li a, #nav li li a:link, #nav li li a:visited{ text-transform:uppercase; }
.home-columns h3, .home-columns h4, a:hover {color: #0AC6F5;}
.home-columns a {text-decoration:none;}
#nav li a {color:#000000;}
#nav li a:hover {
color:#0AC6F5;
}
#nav li li a:hover, #nav li li a:active{background:rgba(0, 0, 0, 0.50);text-transform: uppercase;}
#nav li li a, #nav li li a:link, #nav li li a:visited {
}
#nav { }
#nav ul li{ }
#nav ul li a {
color: #fff}
#nav ul li ul li,#nav ul li ul li a {
border: none;
}
/* Padding
---------------------------------------------------------------- */
.pl20{padding-left:20px;}
.pl10{padding-left:10px;}
.pb10{padding-bottom:10px;}
.pb20{padding-bottom:20px;}
.pr20{padding-right:20px;}
.bd{background: url("images/dot.png") repeat-x scroll left bottom transparent;}
/* Header
---------------------------------------------------------------- */
#header {
}
#header .wrap {
/*background: url("images/topbanner.png") no-repeat scroll 350px 43px transparent;*/
margin: 0 auto;
overflow: hidden;
width:1012px;
padding: 40px 0 20px 0px;
border-bottom: 1px solid #fff;
}
#logo h1, h1{
font-size: 35px;
line-height: 40px;
}
#logo {
float:left;
}
#logo .site-title a , .site-title a{
color: #009999;
font-weight: normal;
font-family: "Georgia";
display: block;
float: left;
font-size: 48px;
line-height: 50px;
margin: 0;
padding: 10px 0 0;
text-decoration: none;
width: 380px;
}
#logo .site-title a:hover {
text-decoration:none;
}
#description {
color: #FFFFFF;
font-size: 12px;
font-style: italic;
font-weight: normal;
margin: 0;
padding: 0 0 0 10px;
display: block;
height: 0;
overflow: hidden;
width: 0;
}
#header-right{
padding: 0px 0 0;
float:right;
width:270px;
}
/* Nav
---------------------------------------------------------------- */
#nav{border-bottom-style: inherit;height: 36px; text-transform: uppercase; width:1012px;
}
.menu-main-container, .menu{margin:0 auto; }
#nav li a .sf-sub-indicator{
width: 11px;
height: 32px;
top: 18px;
right: 0px;
text-indent: -9999px;
overflow: hidden;
position: absolute;
}
#nav li a:hover .sf-sub-indicator{
}
#nav li li a .sf-sub-indicator {
top: 12px;
}
#nav ul {
float: left;
list-style: none;
margin: 0;
}
#nav .sub-menu {
}
#nav .sub-menu .sub-menu{
background: transparent !important;
}
#nav li {
float: left;
list-style: none;
padding: 0;
}
#nav li a {
display: block;
font-family: Helvetica,sans-serif;
text-transform: uppercase;
font-size: 14px;
font-weight: 400;
line-height: 20px;
margin: 0;
padding: 11px 19px;
position: relative;
text-decoration: none;
}
#nav .current-menu-item a {
}
#nav li a:hover, #nav li a:active {
}
#nav li li a, #nav li li a:link, #nav li li a:visited {
font-size:12px;
line-height: 20px;
width: 132px;
margin: 0;
padding:7px 21px 7px 13px;
text-transform:uppercase;
position: relative;
}
#nav li li a:hover, #nav li li a:active {color:#fff;
}
#nav li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 166px;
margin: 0;
padding: 0;
background:#c06;
text-transform:uppercase;
}
#nav li ul ul {
margin: -35px 0 0 166px;
}
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfHover ul ul, #nav li.sfHover ul ul ul {
left: -999em;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfHover ul, #nav li li.sfHover ul, #nav li li li.sfHover ul {
left: auto;
}
#nav li:hover, #nav li.sfHover {
position: static;
}
#nav li a span {
color:#999;
display: block;
font-size: 10px;
line-height: 14px;
}
/* Main
---------------------------------------------------------------- */
#wrapper{margin:0 auto; width:1012px; padding:0px;}h2
#home-third-left{width:660px;}
#home-sidebar{width:300px; float:right;}
#content-sidebar{width:980px;}
#content{width:660px; float:left; min-height:600px;}
/* Homepage Elements
---------------------------------------------------------------- */
#home-top .a-left ul{margin-left:-3px;}
#home-top .a-left li{float:left; padding-left:4px;}
#home-second h3{font-size:32px;}
#home-top .entry-excerpt p{font-size:13px; font-family:Georgia,"Times New Roman",Times,serif; line-height:22px;width:205px;float:left}
#home-top {padding-bottom: 36px;}
.a-left h3 {padding:10px 0px 10px 0px;font-family: 'Cookie', cursive;}
.a-left h3 a{color:#000000; font-size:45px;}
.a-left{padding-bottom: 5px;}
.a-left{width:660px;}
.a-right p{padding:0 40px 10px 10px;}
.a-right{width:300px; }
.home-post{padding-bottom:15px;margin-bottom:20px; min-height: 135px !important;font-size: 13px;line-height: 22px;}
.home-category {
float:left;
width:635px;
}
.home-category h2{font-size:40px;padding-bottom:20px;}
.small{font-size:10px; color:#999;}
.b-1{width:638px; float:left; padding-right: 4px;padding-top: 25px;}
.b-2{width:400px; float:left;}
.firstpost{padding-bottom:10px;margin-bottom:5px;}
.firstpost .entry-excerpt {font-size: 13px;line-height: 22px}
.b-3{width:445px;float:right; /*font-size:11px; line-height:18px;*/}
.b-1 h3 {line-height:28px;}
.c-1-post {width:200px; margin-left: 20px;margin-bottom:5px}
.c-1 h3{font-size:13px !important;padding-top:5px !important;line-height:20px;padding-bottom: 0px !important;}
.c-2-1{width:260px;}
.c-2-1 h3, .c-2-2 h3, .c-3 h3, .d-1 h3{font-size:26px; padding-bottom:10px;}
.c-2-2{width:380px; }
.c-2-2-post{margin-bottom: 15px;min-height: 100px !important;padding-bottom: 15px;}
.c-2-2 p{line-height:22px;font-size:13px}
.c-3-left, .c-3-right{width:320px;}
.featured-left{float:left; width:320px;}
.block-small-item{
height: 90px;
margin-bottom: 13px;
overflow: hidden;
padding-bottom: 13px; width:320px}
.block-meta {
color: #888888;
display: block;
font-size: 11px;
margin-bottom: 4px;
}
.block-meta a {
color: #888888 !important;
}
.block-meta a:hover {
color: #333333 !important;
text-decoration: none;
}
/* Post Page Style
---------------------------------------------------------------- */
.breadcrumbs {background: none repeat scroll 0 0 #F6F6F6;color: #666666;font-size: 11px;margin: 0 0 10px;padding: 3px 15px; display:none;}
.entry-content p{color: #464646;font-family: Georgia,Sans-serif; margin: 0 0 16px; line-height:24px; font-size: 13px;}
.entry-title{margin-bottom:13px;margin-top: 3px;background: url("images/dot.png") repeat-x scroll left bottom transparent;}
.entry-title h1 { color: #000000!important; }
.entry-content h2, .entry-content h3{ font-size: 32px;}
.entry-content ol, .entry-content ul {margin: 0;padding: 0 0 20px;}
.entry-content ol {margin: 0;}
.entry-content ul li {list-style-type: square;margin: 0 0 0 10px;}
.entry-content ol li {list-style: decimal outside none;margin: 0 0 0 25px;}
.entry-content ol ol, .entry-content ul ul {padding: 0;}
.entry-content li{padding:0 0 5px 0;}
.entry-content .wp-caption-text{color: #666666;font-size: 11px;font-style: italic;line-height: 16px;margin: 0;text-align: center;}
.post-meta {
background-color: #F6f6f6;
border-radius: 5px 5px 5px 5px;
clear: both;
color: #666666;
font-size: 11px;
padding: 7px 10px 5px;
margin-bottom: 15px;
display: none;
}
.entry-content clearfix {
padding-top: 10px;
}
.post-info {
font-size: 12px;
margin-bottom: 10px;
display: inline;
float: left;
padding-bottom: 15px;
font-family: verdana;
color: black;
}
.linkwithin_posts a {
background: none !important;
border: none !important;
padding-right: 5px !important;
}
.linkwithin_hook {
background: none repeat scroll 0 0 transparent;
color: #;
font-weight: bold;
letter-spacing: -0.25px;
line-height: 45px;
margin-bottom: 10px;
}
.linkwithin_text {
color: #cc0066;
font-size: 38px;
padding-left: 10px;
}
.linkwithin_title {
color: #464646!important;
font-family: verdana, sans-serif !important;
font-size: 12px !important;
line-height: 14px !important;
text-decoration: none;
}
.linkwithin_title:hover {
color: #c06!important;
text-decoration: underline !important;
}
.post-info .post-author {
background: url("images/post-author.png") no-repeat scroll left center transparent;
padding: 5px 16px 3px 61px;
font-size: 12px;
font-style: italic;
}
.post-info .time {
font-style:italic;
}en
.post-comments {
background: url("images/post-comments.png") no-repeat scroll left center transparent;
padding: 6px 20px 6px 40px;
}
#disqus_thread {
padding-top: 50px;
}
.cat{
background: url("images/icon-categories.png") no-repeat scroll left top transparent;
padding: 3px 0 3px 22px; display: none;
}
.tags{
background: url("images/icon-tags.png") no-repeat scroll left top transparent;
margin: 0 0 0 10px;
padding: 3px 0 3px 20px; display: none;
}
blockquote {background: url(images/q.png) no-repeat;border: none;margin: 5px 15px;padding: 15px 20px 10px 40px;}
blockquote p {color: #666;font-style: italic;}
.page-template-page-fullwidth-php #content{width:980px;}
#social{width:660px; padding:10px 0 5px; display:none;}
/* Pre- Next
---------------------------------------------------------------- */
#nav-below {padding-bottom:20px;}
.nav-previous a, .nav-next a {background: none repeat scroll 0 0 #0197B2;color: #FFFFFF;float: left;width: 100px;
font-weight: bold;display: block;font-size:12px;line-height:26px;font-family:arial,verdana,sans-serif;
height: 25px;text-align: center;width: 80px;overflow: hidden;}
.nav-previous a:hover, .nav-next a:hover{background:#009999;}
#nav-below .nav-previous a, #nav-below .nav-next a {
padding: 0 10px;
width: 45%;
}
.nav-previous a {
float: right;
}
.nav-next a {
float: left;
}
.nav-next a:hover, .nav-previous a:hover {
text-decoration: none;
}
/* Related Posts
---------------------------------------------------------------- */
.related-posts{ font-size:12px; line-height:18px;}
.relateimage img {border: 1px solid #EEEEEE;
height: 150px;
width: 150px;}
.listing {float: left;
padding-left: 20px;
width: 150px; }
.related-posts-title {
color: #0091A8;
margin:20px 0 10px 22px;
padding-bottom: 15px;}
/* Sidebar
---------------------------------------------------------------- */
#sidebar{
display: inline;
float: right;
line-height: 20px;
width: 300px;
}
#sidebar h4, #latest-posts h4 {
/*background-color: #0AC6F5;*/
background: url("images/banner.jpg") no-repeat top center;
color: #fff;
font-size: 36px;
text-align:center;
line-height: 38px;
padding: 7px 0px 0px 3px;
margin: 0 0 5px;
}
#sidebar p{margin-bottom:10px;}
.widget-wrap {
margin: 0 0 10px;
}
.widget{
margin: 0 0 30px;
}
.widget-area ul li {
border-bottom: 1px dotted #CCCCCC;
list-style-type: none;
padding: 0 0 5px 5px;
word-wrap: break-word;
font-size: 13px;
}
.widget-area li li, .widget-area li li li{
border-bottom: 0 none;
list-style: square outside none;
margin: 0 0 0 20px;
padding: 5px 0 0 0;
}
#sidebar .flickr-photos li{
float: left;
background:none;
list-style-type: none;
padding:8px;
}
#sidebar .twitter h4{
background: url("images/tt.png") no-repeat scroll left center transparent;
line-height: 30px;
padding: 0 0 0 40px;
}
#sidebar_left{
float: left;
width:160px;
#sidebar_left a {
text-decoration:none !important;}
}
a:-webkit-any-link {
text-decoration:none !important;}
}
#header-right a:-webkit-any-link {
padding-right: 15px;
}
#sidebar_right{
float: right;
width:120px;
}
.twitter h4 {
background: url("images/tt.png") no-repeat scroll left center transparent;
padding: 0 0 6px 35px;}
/* archive
---------------------------------------------------------------- */
.archive .post img, .search .post img {width:150px; height:auto;}
#archive-title {padding-bottom:15px; font-size:22px; display:none;}
/* search
---------------------------------------------------------------- */
input[type="button"], input[type="submit"] { border: none;color: #FFFFFF;cursor: pointer;font-size: 13px;font-weight: normal;text-decoration: none; }
input[type="button"]:hover, input[type="submit"]:hover {background-color: #565656; }
input, select, textarea,.sticky, .taxonomy-description {border: 1px solid #DDDDDD;}
#search {width: 265px;
padding-left: 18px;
padding-top: 5px;
padding-bottom: 10px;}
#search .s {
background: #c06;
border: medium none;
color: #fff;
font-size: 12px;
padding: 5px 8px;
width: 157px;float: left;
}
#search .search-submit{background: url("images/s.png") no-repeat scroll center center transparent;
border: medium none;
cursor: pointer;
float: right;
height: 28px;
margin: 0;
right: 0;
top: 0;
width: 39px;}
#search div {
background: #c06;
height: 27px;
position: relative;
border: 2px solid #0AC6F5;
}
/* Pagination
---------------------------------------------------------------- */
.ct-paginate {padding: 10px 0 20px 0; overflow:hidden; clear:both; font-family: arial;}
.ct-paginate a {border:1px solid #eee; margin-right:5px; padding:4px 8px; text-align:center; text-decoration:none;}
.ct-paginate .ct-title {color:#555; margin-right:4px;}
.ct-paginate .ct-gap {color:#999; margin-right:4px;}
.ct-paginate a:hover, .ct-paginate a:active, .ct-paginate .ct-current {color:#fff; background: url("images/navbg.png") repeat scroll 0 0 #333333;border:1px solid #ddd; margin-right:5px;padding:4px 8px;}
/* Footer
---------------------------------------------------------------- */
.footer-info {padding:30px 0;}
.footer-info .right{width:1012px;text-align:center;}
/* =Comments
------------------------------------------------------------------ */
#comments {padding:20px 0 0 0;}
#comments h3,#respond h4{color: #0091A8;
}
#comments a{
text-decoration:none;
}
#comments a:hover{
text-decoration:underline;
}
#comments input:hover, #commentstextarea:hover{
background: #f5f5f5;
}
#commentform {
margin: 5px 10px 0px 0px;
}
#commentform textarea {
width: 90%;
padding: 5px;
font-size:13px
}
#respond:after {
content: ".";
display: block;
height: 0px;
clear: both;
visibility: hidden;
}
#commentform p {
margin: 20px 0;
}
#commentform #submit, .wpcf7-submit{
-moz-box-shadow:inset 0px 1px 0px 0px #fbafe3;
-webkit-box-shadow:inset 0px 1px 0px 0px #fbafe3;
box-shadow:inset 0px 1px 0px 0px #fbafe3;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f03c96), color-stop(1, #cc0066) );
background:-moz-linear-gradient( center top, #f03c96 5%, #cc0066 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f03c96', endColorstr='#cc0066');
background-color:#f03c96;
-moz-border-radius:17px;
-webkit-border-radius:17px;
border-radius:17px;
border:1px solid #ee1eb5;
display:inline-block;
color:#ffffff;
font-family:Arial;
font-size:13px;
padding:6px 24px;
text-decoration:none;
text-shadow:1px 1px 0px #ff0080;
}
#commentform #submit:hover, .wpcf7-submit:hover {
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ef027d), color-stop(1, #ff5bb0) );
background:-moz-linear-gradient( center top, #ef027d 5%, #ff5bb0 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ef027d', endColorstr='#ff5bb0');
background-color:#ef027d;
}
#commentform #submit:active {
position:relative;
top:1px;
}
.commentlist {
margin: 0px;
padding: 0px;
}
.commentlist ol {
margin: 0px;
padding: 10px;
}
.commentlist li {
margin: 15px 0;
padding:15px;
list-style: none;
}
.commentlist li ul li {
margin: 10px;
}
.commentlist p {
margin: 10px 5px 10px 0px;
padding: 0px;
}
.commentlist li ul li {
font-size: 12px;
}
.commentlist li .avatar {
background-color: #FFFFFF;
border: 1px solid #EEEEEE;
box-shadow: 0 0 2px rgba(0, 0, 0, 0.1);
float: left;
margin: 0 10px 0 0;
padding: 3px;
}
.commentlist cite, .commentlist cite a {
font-style: normal;
font-size: 14px;
}
.commentlist p {
}
.commentmetadata {
font-weight: normal;
padding:5px 0 0 0;
}
.alt {
margin: 0px;
padding: 10px;
}
.children {
margin: 0px;
padding: 0px;
}
.nocomments {
text-align: center;
margin: 0px;
padding: 0px;
}
.commentmetadata {
font-size: 11px;
margin: 0px;
display: block;
}
.navigation {
display: block;
text-align: center;
margin-top: 10px;
margin-bottom: 40px;
}
.thread-alt {
background: #FFFFFF;
margin: 0px;
padding: 0px;
}
.thread-even {
background: #FFFFFF;
margin: 0px;
padding: 0px;
}
.depth-1 {
border: 1px solid #BBBBBB;
margin: 0px;
padding: 0px;
}
.even, .alt {
border:1px solid #eeeeee;
border-radius: 5px 5px 5px 5px;
}
em.date, .comment strong {
font-weight:normal;
color:#9E825F;
line-height:24px;
display:block;
font-style: normal;
}
/* Socialmedia
---------------------------------------------------------------- */
/* Additional
---------------------------------------------------------------- */
/* Styling posts
---------------------------------------------------------------- */
.one_half, .one_third, .two_third, .three_fourth, .one_fourth {
float: left;
line-height: 21px;
margin-bottom: 20px;
margin-right: 4%;
}
.one_half {
width: 48%;
}
.one_third {
width: 30.6%;
}
.two_third {
width: 65.3%;
}
.one_fourth {
width: 22%;
}
.three_fourth {
width: 74%;
}
.last {
clear: right;
margin-right: 0 !important;
}
.dropcap {
color: #383838;
float: left;
font-size: 40px;
margin-right: 6px;
padding-top: 7px;
position: relative;
text-transform: uppercase;
top: 5px;
}
.highlight1 {
background: none repeat scroll 0 0 #F6F67A;
}
.highlight2 {
background: none repeat scroll 0 0 #000000;
color: #CCCCCC;
}
.mosaic-block {
float:left;
position:relative;
overflow:hidden;
width:210px;
height:120px;
/*background:#111 url(images/progress.gif) no-repeat center center;
-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.5);*/
border-radius: 15px;
}
.mosaic-backdrop {
display:none;
position:absolute;
top:0;
height:100%;
width:100%;
/*background:#111;*/
}
.mosaic-overlay {
display:none;
z-index:5;
position:absolute;
width:100%;
height:100%;
background:#111;
}
.bar .mosaic-overlay {
bottom:-100px;
height:40px;
background:url(images/bg-black.png);
}
.details{ margin:3px 10px; color:#eee; font-size:11px;}
.footer-links-copyright, .footer-links-copyright a{ color:#0AC6F5; font-size:11px;padding-right:10px;}
.attachment1{ text-align:center;}
#content .gallery img, #gallery-listing img{background: none repeat scroll 0 0 #DDDDDD;border: 5px solid #FFFFFF; box-shadow: 0 1px 2px #CCCCCC;margin: 5px; padding: 1px; max-width:160px; height:auto;}
#content .cb_pin_images {
margin-left: auto !important;
margin-right: auto !important;
}
.entry-content img {max-width:100%; height:auto; border: 5px solid #FBDDDF;}
.first-thumb img {
box-shadow:5px 5px 1px #888;}
.hfeed img.thumbnail {
float: left; height: 160px;
}
.archive .hfeed article {
margin-left: 20px;
float:left;
width: 470px;}
}
I changed this HTML for the first image
<center><a href="http://renegadechicks.com/wp-content/uploads/2013/02/centerpiece15.jpg
<img class="size-full wp-image-10673 aligncenter" alt="centerpiece15" src="http://renegadechicks.com/wp-content/uploads/2013/02/centerpiece15.jpg" width="361" height="559">
</a></center>
To this in chrome:
<p style="clear: both;">
<a href="http://renegadechicks.com/wp-content/uploads/2013/02/centerpiece15.jpg">
<img class="size-full wp-image-10673 aligncenter" alt="centerpiece15" src="http://renegadechicks.com/wp-content/uploads/2013/02/centerpiece15.jpg" width="361" height="559">
</a>
</p>
and it seemed to center just fine. I for some reason had to toggle the text-decoration on the tag off then on for it to work...
Basically, I replaced the < center > tags with < p> tags and made sure to clear any floats that were set up before hand.
Related
I can't seem to get my bullets/marks to hide from my menu bar on my site. I've tried using list-style-type: none but it doesn't seem to be working.
I'm a code newbie so any help would be of huge help! I'm sure I'm overlooking something obvious. Best, E
body {
background: #262626;
margin: 5px 0 15px 0;
padding: 0;
text-align: center;
font-family: verdana, arial, sans-serif;
font-size: 75%;
color: #333333;
}
/* Typography
------------------------------------------------------------------ */
#top p {
font-size: 1em;
line-height: 1.6em;
margin: 0;
padding: 0;
color: #CCCCCC;
}
#header p {
font-size: 1em;
line-height: 1.6em;
margin: 0;
padding: 0;
}
#menu p {
font-size: 1em;
line-height: 1.6em;
margin: 0;
padding: 0;
}
#content p {
font-size: 1em;
line-height: 1.6em;
margin: 0 0 15px 0;
padding: 0;
}
#footer p {
font-size: 1em;
line-height: 1.6em;
margin: 0;
padding: 0;
text-align: center;
color: #CCCCCC;
}
#bottom p {
font-size: 1em;
line-height: 1.6em;
margin: 0;
padding: 0;
color: #CCCCCC;
}
h1, h2, h3, h4, h5, h6 {
margin: 0 0 .6em 0;
color: #333333;
font-family: verdana, arial, sans-serif;
letter-spacing: -.06em;
line-height: 1.1em;
}
h4 {
color: #cc0000;
font-family: 'Permanent Marker', cursive;
}
h1 { font-size: 2.2em; }
h2 { font-size: 3em;
font-family: 'Bangers', cursive;
letter-spacing: .1em;
}
h3 { font-size: 1.8em; }
h4 { font-size: 2.1em; }
h5 { font-size: 1.4em; }
h6 { font-size: 1.2em; }
#header h1 {
padding: 20px 0 0 20px;
margin: 0;
font-size: 4.1em;
font-family: 'Nosifer', cursive;
color: #cc0000;
}
#header h2 {
padding: 0px 0 0px 25px;
margin-top: 15px;
font-size: 2.2em;
letter-spacing: 1.3px;
color: #CCCCCC;
font-weight: normal;
font-family: 'Bangers', cursive;
}
/* Hyperlinks
------------------------------------------------------------------ */
#top a:link {color: #FFFFFF; text-decoration: none;}
#top a:visited {color: #FFFFFF; text-decoration: none;}
#top a:hover {color: #FFFFFF; text-decoration: underline;}
#top a:active {color: #FFFFFF; text-decoration: none;}
#header a:link {color: #FFFFFF; text-decoration: none;}
#header a:visited {color: #FFFFFF; text-decoration: none;}
#header a:hover {color: #FFFFFF; text-decoration: none;}
#header a:active {color: #FFFFFF; text-decoration: none;}
a:link {color: #CC0000; text-decoration: none;}
a:visited {color: #CC0000; text-decoration: none;}
a:hover {color: #CC0000; text-decoration: underline;}
a:active {color: #CC0000; text-decoration: none;}
#menu a:link {
color: #FFFFFF;
text-decoration: none;
padding: 13.5px;
margin:1px;
}
#menu a:visited {
color: #FFFFFF;
text-decoration: none;
padding: 10px;
margin:1px;
}
#menu a:hover {
color: #111111;
text-decoration: none;
background-color: #FFFFFF;
padding: 10px;
margin:0;
border:1px solid #111111;
}
#menu a:active {
text-decoration: none;
}
#COMPMENU a:link {
color: #cc0000;
text-decoration: none;
padding: 13.5px;
margin:1px;
}
#COMPMENU a:visited {
text-decoration: none;
padding: 10px;
margin:1px;
}
#COMPMENU a:hover {
color: #111111;
text-decoration: none;
background-color: #FFFFFF;
padding: 10px;
margin:0;
border:1px solid #111111;
}
#COMPMENU a:active {
text-decoration: none;
}
#footer a:link {color: #FFFFFF; text-decoration: none;}
#footer a:visited {color: #FFFFFF; text-decoration: none;}
#footer a:hover {color: #FFFFFF; text-decoration: underline;}
#footer a:active {color: #FFFFFF; text-decoration: none;}
#bottom a:link {color: #FFFFFF; text-decoration: none;}
#bottom a:visited {color: #FFFFFF; text-decoration: none;}
#bottom a:hover {color: #FFFFFF; text-decoration: underline;}
#bottom a:active {color: #FFFFFF; text-decoration: none;}
/* Unordered Lists
------------------------------------------------------------------ */
#content ul, #bottom ul {
margin-left: 0;
padding-left: 0;
list-style: none;
font-size: 1em;
line-height: 1.7em;
margin: 0 0 1em 0;
}
#content li, #bottom li {
padding-left: 12px;
margin-bottom: .2em;
background-image: url(../img/arrow.gif);
background-repeat: no-repeat;
background-position: 0 .5em;
}
/* Page Structure
------------------------------------------------------------------ */
#wrapper {
width: 760px;
padding: 0;
margin: 0 auto;
border: 1px solid #222222;
background-color: #FFFFFF;
text-align: left;
}
#top {
width: 760px;
margin: 0 auto;
padding: 10px 0;
}
#header {
height: 255px;
margin: 5px 5px 0 5px;
border: 0px solid #cccccc;
background: black url(../img/header.jpg) top left no-repeat;
}
#menu {
margin: 0 5px 0 5px;
padding: 20px 10px 20px 10px;
border-top: 1px solid #666666;
background: #212121 url(../img/menu.jpg) top left repeat-x;
}
#menu_list {
padding: 0;
margin: 0;
text-align: left;
}
#menu_list li
{
text-align: left;
font-size: 1.2em;
font-weight: bold;
display: inline;
list-style-type: none;
padding: 0 .9em 0 0em;
margin: 0;
}
#content {
margin: 0 5px 0 5px;
padding: 20px;
border: 0px solid #cccccc;
background: #FFFFFF url(../img/sidebar.jpg) top right repeat-y;
}
#left {
float: left;
padding: 0;
margin: 0;
width: 480px;
}
#right {
float: right;
padding: 0;
margin: 00;
width: 180px;
}
#footer {
margin: 0 5px 5px 5px;
padding: 20px 10px;
border: 0px solid #cccccc;
background-color: #9E0B0E;
}
#bottom {
width: 760px;
margin: 0 auto;
padding: 10px 0;
border: 0px solid #cccccc;
}
.spacer { clear: both; }
#COMPMENU {
margin: 0 3px 0 3px;
padding: 5px 2.5px 5px 2.5px;
border-top: 1px;
margin-bottom: 10px;
}
#COMPMENU_list {
padding: 0;
margin: 0;
text-align: left;
list-style-type: none;
}
#COMPMENU_list li
{
text-align: left;
font-size: 1.9em;
font-weight: bold;
display: inline;
padding: 0 .9em 0 0em;
margin: 0;
color: #cc0000;
font-family: 'Permanent Marker', cursive; }
/* Images
------------------------------------------------------------------ */
.photo_frame {
float: right;
padding: 5px;
border: 1px solid #EEEEEE;
border-right: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
margin: 5px 0 10px 15px;
}
.photo_frame img {
margin: 0;
padding: 0;
border: 0;
}
.Fridaythe13th img {
width: 190px;
height: 280px;
}
figcaption {
font-size: 60%;
text-align: center;
margin-top: .5em;}
.SlasherCollage img {
width: 425px;
height: 319px;
float: right;
margin: 1.5em;}
.Leatherface img {
width: 425px;
height: 319px;
float: right;
margin: 1.5em;}
<div id="COMPMENU">
<ul id="COMPMENU_list">
<li>Killers</li>
<li>Terrible Place</li>
<li>Weapons</li>
<li>Victims</li>
</ul>
</div>
Your problem is not bullets. You have an image set on your #content li, #bottom li styles. To not have it affect this list add background-image: none; like this:
#COMPMENU_list li {
text-align: left;
font-size: 1.9em;
font-weight: bold;
display: inline;
padding: 0 .9em 0 0em;
margin: 0;
color: #cc0000;
font-family: 'Permanent Marker', cursive;
list-style-type: none;
list-style: none;
background-image: none;
}
I want to change a color of the main menu background in classical free Drupal 7 theme. It is in orange, I want to make it in the other color (dark blue or green). This is the Drupal repository for the themes
I could not locate the necessary CSS code block to change. I have read theme guides, color schemes and books on it, not clear yet. The orange color there starts with ff...
Please advise how to do it.
Here is the CSS original code:
#font-face {
font-family: 'BebasNeueRegular';
src: url('fonts/BebasNeue-webfont.eot');
src: url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/BebasNeue-webfont.woff') format('woff'),
url('fonts/BebasNeue-webfont.ttf') format('truetype'),
url('fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
font-weight: normal;
font-style: normal;
}
#font-face {
font-family: 'YanoneKaffeesatzRegular';
src: url('fonts/YanoneKaffeesatz-Regular-webfont.eot');
src: url('fonts/YanoneKaffeesatz-Regular-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/YanoneKaffeesatz-Regular-webfont.woff') format('woff'),
url('fonts/YanoneKaffeesatz-Regular-webfont.ttf') format('truetype'),
url('fonts/YanoneKaffeesatz-Regular-webfont.svg#YanoneKaffeesatzRegular') format('svg');
font-weight: normal;
font-style: normal;
}
/* Deafults */
/* Default Style
--------------------------------*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display:block;
}
nav ul {
list-style:none;
}
blockquote, q {
quotes:none;
border: 1px solid #bbbbbb;
background: rgb(241, 241, 241) url(images/quote.png) no-repeat;
padding: 10px 5px 5px 47px;
text-shadow: 1px 1px #fff;
margin: 5px 0;
border-radius: 7px;
}
blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
}
pre {
background: #d8d8d8;
text-shadow: 1px 1px #fff;
border: 1px solid #bbbbbb;
padding: 7px;
margin: 5px 0;
border-radius: 7px;
}
code {
background: rgb(240, 240, 240);
text-shadow: 1px 1px #fff;
border: 1px solid #bbbbbb;
display: block;
padding: 7px;
margin: 5px 0;
border-radius: 7px;
}
ins {
background-color:#fdfc9b;
text-decoration:none;
}
mark {
background-color:#fdfc9b;
font-style:italic;
font-weight:bold;
}
del {
text-decoration: line-through;
}
abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
}
hr {
height:1px;
background: #9f9f9f;
margin: 7px 0;
border: none;
clear: both;
float: none;
width: 100%;
}
input, select {
vertical-align:middle;
}
select {
border-radius: 4px;
border: 1px solid #ACACAC;
padding: 3px 4px;
}
.clear {
clear: both;
}
.clearfix:after {
display: block;
visibility: hidden;
content: ".";
clear: both;
text-indent: -9999px;
height: 0;
}
.remove-margin {
margin-right: 0 !important;
}
fieldset {
border: 1px solid #ccc;
margin: 0 0 1.4615em;
padding: 1.5385em;
}
table {
border-collapse:collapse;
border-spacing:0;
margin-bottom: 15px;
width: 100%;
}
th, tr, td {
vertical-align: middle;
}
.sticky-header th, .sticky-table th {
border-bottom: 3px solid #ccc;
padding-right: 1em;
text-align: left;
}
body {
margin:0 auto;
padding:0;
font-family:Tahoma,Georgia,Arial,sans-serif;
font-size:13px;
background:url(images/body_bg.png) repeat-x center top #fff;
line-height:1.5em;
}
a {
text-decoration: none;
color: #0593C7;
-webkit-transition: color 0.2s ease-in-out;
-moz-transition: color 0.2s ease-in-out;
-o-transition: color 0.2s ease-in-out;
-ms-transition: color 0.2s ease-in-out;
transition: color 0.2s ease-in-out;
}
a:hover {
text-decoration: none;
color: #0579A4;
}
p {
margin: 0 0 0.8em;
}
strong {
font-weight: 700;
}
em {
font-style: italic;
}
h1,h2, h3, h4, h5, h6 {
line-height:125%;
font-weight: normal;
}
h1 {
font-size: 26px;
}
h2 {
font-size: 21px;
}
h3 {
font-size: 19px;
}
h4 {
font-size: 17px;
}
h5 {
font-size: 15px;
}
h6 {
font-size: 13px;
}
.clear {
clear:both;
}
/* The Outer cover */
#wrapper {
width:1000px;
margin:0px auto;
}
#content-container{
padding:0px;
width:100%;
}
/* TOP */
#header-top{
margin:0px auto;
position:relative;
height:100%;
}
.logo{
float: left;
width:300px;
}
.logo #logoimg {
float:left;
height: 55px;
margin:0;
padding:0 12px 0 0;
}
.logo #logoimg img{
width: 100%;
height: 100%;
}
.logo .sitename {
float:left;
}
.logo .sitename h1{
font-size:32px;
font-family:BebasNeueRegular,Arial, serif;
font-weight:normal;
margin: 10px 0;
}
.logo .sitename h1 a:link, .logo .sitename h1 a:visited{
color:#f25409;
}
.logo .sitename h1 a:hover{
color:#666;
}
.logo .sitename h2 {
color:#888;
font-size: 10px;
position: relative;
top: -18px;
font-weight:normal;
}
/* Social bookmarks */
.social-icons {
float: right;
margin-top: 10px;
}
.social-icons li {
float: left;
font-size: 11px;
margin: 3px 5px;
padding:0px;
text-transform: uppercase;
list-style: none;
}
/* PRIMARY NAVIGATION */
#menu-container{
height:55px;
text-transform:uppercase;
clear:both;
border-top:1px solid #fff;
border-bottom:1px solid #fff;
padding: 0 0 0 10px;
background:#fff;
}
#main-menu {
float: right;
width:660px;
margin: 0 auto 0;
overflow: hidden;
}
#main-menu ul {
float: right;
list-style: none;
margin: 0;
padding: 0;
}
#main-menu li {
float: left;
list-style: none;
margin: 0;
padding: 0;
line-height:40px;
font-family:BebasNeueRegular,Arial, serif;
font-size:18px;
}
#main-menu li a {
color: #45565a;
display: block;
margin: 0;
padding: 8px 20px;
text-decoration: none;
position: relative;
border-right: 1px solid #E7EEF0;
}
#main-menu li:last-child a{
border:0;
}
#main-menu li a:hover, #main-menu li a:active, #main-menu .active-trail a, #main-menu li a.active {
color: #fff;
background: #fe5c11;
}
#main-menu li a.sf-with-ul {
padding-right: 10px;
}
#main-menu li a .sf-sub-indicator {
display: block;
width: 10px;
height: 10px;
text-indent: -9999px;
overflow: hidden;
position: absolute;
top: 19px;
right: 5px;
}
#main-menu li li a, #main-menu li li a:link, #main-menu li li a:visited {
background: #444;
color: #ddd;
width: 148px;
font-family: Arial, Tahoma, Verdana;
margin: 0;
padding: 3px 10px;
line-height:30px;
border-left: 1px solid #333;
border-right: 1px solid #333;
border-bottom: 1px solid #333;
text-transform: none;
position: relative;
font-size:12px;
}
#main-menu li li a:hover, #main-menu li li a:active {
background: #4a4a4a;
color: #fff;
}
#main-menu li li a .sf-sub-indicator {
top: 10px;
}
#main-menu li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 170px;
margin: 1px 0px 0px 0px;
padding: 0;
}
#main-menu li ul a {
width: 150px;
}
#main-menu li ul a:hover, #main-menu li ul a:active {
}
#main-menu li ul ul {
margin: -31px 0 0 169px;
}
#main-menu li:hover ul ul, #main-menu li:hover ul ul ul, #main-menu li.sfHover ul ul, #main-menu li.sfHover ul ul ul {
left: -999em;
}
#main-menu li:hover ul, #main-menu li li:hover ul, #main-menu li li li:hover ul, #main-menu li.sfHover ul, #main-menu li li.sfHover ul, #main-menu li li li.sfHover ul {
left: auto;
}
#main-menu li:hover, #main-menu li.sfHover {
position: static;
}
/* HOME PAGE */
#slider{
position:relative;
width:900px;
margin:50px auto 25px;
padding-bottom:20px;
}
#front-welcome{
text-align:center;
padding:20px 0 0 0;
font-family:"YanoneKaffeesatzRegular",arial;
margin-bottom:-30px;
}
#front-welcome .block > h2{
color:#282c2f;
font-size:28px;
margin:0px auto;
font-family:"YanoneKaffeesatzRegular",arial;
font-weight:normal;
text-transform: none;
}
#front-welcome p{
padding:10px 0px;
color:#282c2f;
line-height:22px;
font-size:18px;
font-family:"YanoneKaffeesatzRegular",arial;
}
/*------------------------------------------------*/
#page-container{
float: left;
margin: 0 auto;
width: 95%;
overflow: hidden;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.not-front #page-container{
background: white;
padding: 20px;
border: 1px solid #DDD;
width: 100%;
}
#content {
display: inline;
margin: 0;
}
/* 3 columns */
body.two-sidebars #content {
float: left;
margin: 0 0 0 25px;
padding: 0;
width: 495px;
}
/* 2 columns: sidebar-first */
body.sidebar-first #content {
float: right;
margin: 0;
padding: 0;
width: 725px;
}
/* 2 columns: sidebar-second */
body.sidebar-second #content {
float: left;
margin: 0;
padding: 0;
width: 675px;
}
body.two-sidebars #sidebar-first {
float: left;
margin: 0;
padding: 0;
width: 200px;
}
/* 3 columns: sidebar-second */
body.two-sidebars #sidebar-second {
float: right;
margin: 0;
padding: 0;
width: 200px;
}
/* 2 columns: sidebar-first */
body.sidebar-first #sidebar-first {
float: left;
margin: 0;
padding: 0;
width: 200px;
}
/* 2 columns: sidebar-second */
body.sidebar-second #sidebar-second {
float: right;
margin: 0;
padding: 0;
width: 200px;
padding-left: 20px;
min-height: 330px;
-webkit-box-shadow: -2px 1px 2px #DDD;
-moz-box-shadow: -2px 1px 2px #DDD;
-o-box-shadow: -2px 1px 2px #DDD;
box-shadow: -2px 1px 2px #DDD;
}
.node {
margin-bottom: 20px;
padding-bottom: 20px;
}
#preface-wrapper {
margin: 0 auto;
}
#preface-wrapper .column {
float: left;
}
#preface-wrapper.in1 .column {
width: 100%;
}
#preface-wrapper.in2 .column {
width: 50%;
}
#preface-wrapper.in3 .column {
width: 33.3%;
}
#preface-wrapper .block {
padding-left: 15px;
padding-right: 15px;
}
#bottom-wrapper {
margin: 10px auto 0;
text-align: left;
width: 930px;
}
#bottom-wrapper .column {
float: left;
padding-bottom: 15px;
}
#bottom-wrapper.in1 .column {
width: 100%;
}
#bottom-wrapper.in2 .column {
width: 50%;
}
#bottom-wrapper.in3 .column {
width: 33.3%;
}
#bottom-wrapper.in4 .column {
width: 25%;
}
#bottom-wrapper .block {
padding-left: 15px;
padding-right: 15px;
}
.bottom{
clear: both;
background:#f4f4f4;
padding:10px 0px;
}
.bottom-container{
margin: auto;
width: 930px;
}
.bottom-container .column {
float: left;
}
.bottom-container.in1 .column {
width: 100%;
}
.bottom-container.in2 .column {
width: 50%;
}
.bottom-container.in3 .column {
width: 33.3%;
}
.bottom-container .block {
padding-left: 15px;
padding-right: 15px;
margin-bottom: 0;
}
.bottom-container p{
padding:5px 0px;
color:#555;
line-height:20px;
}
#footer{
float: left;
padding:10px 0px;
overflow:auto;
font-family:Arial;
color:#777;
background: #d9e0e3;
border:1px solid #cfd7db;
width: 100%;
}
#footer #block-system-powered-by{
margin: 10px 0 0 0;
}
.footer_wrapper{
width: 930px;
margin: 0 auto;
overflow: hidden;
}
.credit{
float:right;
margin:10px 0px;
}
.copyright{
float:left;
margin:10px 0px;
width:400px;
}
.block > h2{
font-family:BebasNeueRegular,Arial, serif;
padding: 0px 0px 4px 0px;
color:#555;
font-size:24px;
font-weight:normal;
margin:5px 0px;
text-transform:uppercase;
border-bottom: 1px solid #ccc;
}
.sidebar .block{
float:left;
width:200px;
font-size:12px;
margin:0px 0px 30px 0px;
display:inline;
overflow:hidden;
}
.block{
margin:0px 0px 30px 0px;
overflow: hidden;
}
.node h2.title, #page-title{
color: #555555;
font-family: BebasNeueRegular,Arial,serif;
font-size: 24px;
font-weight: normal;
padding: 0 0 10px;
}
.node h2.title a{
color: #555555;
}
.content {
color: #333333;
}
/* Slideshow */
#slideshow {
position: relative;
width: 100%;
overflow: hidden;
margin: 20px 0 40px 0;
float: left;
}
#slides {
clear: both;
position: relative;
width: 900px;
margin: auto;
}
.slides_container {
width: 841px;
height: 320px;
overflow: hidden;
position: relative;
z-index: 1;
border: 5px solid white;
margin: 0 auto;
-webkit-box-shadow: 0px 0px 26px #999;
-moz-box-shadow: 0px 0px 26px #999;
-o-box-shadow: 0px 0px 26px #999;
box-shadow: 0px 0px 26px #999;
}
.slides_container a,
.slides_container img {
display: block;
width:840px;
}
#slides .next,
#slides .prev{
position: absolute;
top: 127px;
left: -21px;
width: 78px;
height: 83px;
margin: 0;
background: url(images/slider_arrow.png) -10px -23px;
z-index: 10;
}
#slides .prev{
left: 833px;
background: url(images/slider_arrow.png) -10px 119px;
}
.slides_nav {
display: block !important;
}
#slides ul.pagination {
border: 0;
position: absolute;
z-index: 10;
margin: -25px 0 0 15px;
bottom: 16px;
right: 32px;
}
#slides ul.pagination li {
float:left;
margin: 0 10px 0 0;
list-style:none;
}
#slides ul.pagination li a {
display:block;
width:12px;
height:0;
padding-top:12px;
background: url(images/slides_arrows.png) 0 160px;
float:left;
overflow:hidden;
}
#slides ul.pagination li.current a {
background: url(images/slides_arrows.png) 188px 160px;
}
.submitted {
padding: 4px 9px 4px 0px;
border-radius: 4px;
color: #fe5c11;
clear: both;
display: block;
font-size: 11px;
margin-bottom: 2px;
font-style: italic;
}
footer .links{
font-size: 12px;
}
.links {
color: #000;
margin-top: 10px;
font-size: 14px;
}
.links li a {
background: #C0D8DD;
display: inline-block;
padding: 2px 5px;
border-radius: 4px;
color: #383838;
font-weight: normal;
margin-bottom: 2px;
}
.links li a:hover {
color: #B81007;
}
.content ul, .content ol {
padding-left:20px;
}
.content table {
background: #ececec;
border: 1px solid #bbbbbb;
}
.content th {
background: #dbdbdb;
padding: 5px 4px;
text-shadow: 1px 1px #fff;
border-right: 1px solid #c8c7c7;
}
.content td {
background: #ebebeb;
color: #747474;
text-align: left;
padding-left: 4px;
border-right: 1px solid #c8c7c7;
border-bottom: 1px solid #c8c7c7;
}
/*-------------------------------------------*
/* Fix CKEditor style
/*-------------------------------------------*/
#content-container table.cke_editor {
background: transparent;
border: 0;
}
#content-container table.cke_editor td {
background: transparent;
padding: 0;
border: 0;
}
/*-------------------------------------------*
/* Poll, Buttons, Form
/*-------------------------------------------*/
.poll .vote-form .choices .title {
font-size: 14px;
font-weight: normal;
line-height: 2;
}
.poll .vote-form .choices {
margin: 0;
}
input.form-checkbox, input.form-radio {
vertical-align: baseline;
}
.form-text {
border-radius: 3px;
border: 1px solid #acacac;
padding: 4px 5px;
}
/*-------------------------------------------*
/* Menus and item lists
/*-------------------------------------------*/
.item-list ul {
margin: 0;
padding: 0 0 0 1.5385em;
}
.item-list ul li {
margin: 0;
padding: 0;
}
ul.menu li {
margin: 0;
padding: 0;
}
ul.inline {
clear: both;
}
ul.inline li {
margin: 0;
padding: 0;
}
/*-------------------------------------------*
/* Admin Tabs
/*-------------------------------------------*/
.tabs-wrapper {
border-bottom: 1px solid #b7b7b7;
margin: 0 0 5px 0;
}
ul.primary {
border: none;
margin: 0;
padding: 0;
}
ul.primary li a {
background: none;
border: none;
display: block;
float: left;
line-height: 1.5385em;
margin: 0;
padding: 0 1em;
border-radius: 4px 4px 0 0;
margin-right: 5px;
}
ul.primary li a:hover, ul.primary li a.active {
background: #666;
border: none;
color: #fff;
}
ul.primary li a:hover {
background: #888;
text-decoration: none;
}
ul.secondary {
background: #666;
border-bottom: none;
clear: both;
margin: 0;
padding: 0;
}
ul.secondary li {
border-right: none;
}
ul.secondary li a, ul.secondary li a:link {
border: none;
color: #ccc;
display: block;
float: left;
line-height: 1.5385em;
padding: 0 1em;
}
ul.secondary li a:hover, ul.secondary li a.active {
background: #888;
color: #fff;
text-decoration: none;
}
ul.secondary a.active {
border-bottom: none;
}
/*-------------------------------------------*
/* Tabs and Tags
/*-------------------------------------------*/
.field-name-field-tags {
margin: 0 0 10px 0;
}
.field-name-field-tags a{
display: inline-block;
background: rgb(235, 235, 235);
padding: 1px 5px;
height: 22px;
color: #333;
text-shadow: 1px 1px #fff;
border-radius: 2px;
font-size: 12px;
}
.field-name-field-tags a:hover{
color: #205194;
}
.field-name-field-tags .field-item {
margin: 0 1em 0 0;
}
.field-name-field-tags div {
display: inline;
}
#content-container .field-label{
}
#content-container .field-items .field-item{
}
/*-------------------------------------------*
/* Profile
/*-------------------------------------------*/
.profile {
margin: 1.5385em 0;
}
.profile dd {
margin-bottom: 1.5385em;
}
.profile h3 {
border: none;
}
.profile dt {
margin-bottom: 0;
}
.password-parent {
width: 36em;
}
/*-------------------------------------------*
/* comment
/*-------------------------------------------*/
#comments {
clear: both;
margin-top: 14px;
padding: 10px;
border: 1px solid #dddddd;
border-radius: 8px;
background: rgb(253, 253, 253);
}
.comment {
margin-bottom: 1.5em;
padding: 5px;
border-radius: 7px;
min-height: 150px;
border-bottom: 1px solid #d9d9d9;
}
h3.comment-title a{
margin-bottom: 5px;
font-size: 16px;
color: #67696d;
}
.comment .new {
color: red;
text-transform: capitalize;
margin-left: 1em;
}
.form-textarea-wrapper textarea {
border-radius: 3px;
border: 1px solid #acacac;
}
.comment .submitted {
display:inline;
background: #e5e5e5;
}
.comment .user-picture{
float: left;
padding: 4px;
border: 1px solid #d9d9d9;
margin-right: 7px;
margin-bottom: 7px;
}
.comment-new-comments{
display: none;
}
/*-------------------------------------------*
/* Navigation
/*-------------------------------------------*/
.item-list .pager {
}
.item-list .pager li {
background: #cfcfcf;
border-radius: 3px;
margin-right: 4px;
text-shadow: 1px 1px #fff;
}
/*-------------------------------------------*
/* Forum
/*-------------------------------------------*/
.field-name-taxonomy-forums div {
display: inline;
margin-top: 4px;
}
.field-name-taxonomy-forums .field-items {
}
#forum .title {
font-size: 16px;
}
#forum .submitted {
font-size: 12px;
font-family: Lucida Grande, Verdana, Arial, sans-serif;
background: transparent;
padding: 0;
}
#forum .container {
background: #a1a1a1;
color: #fff;
}
.....end...
Change Line 371 in /sites/all/classic-theme/style.css
background: #fe5c11;
to whatever color you like.
I'm working on a css/html site and I have this problem: in my style.css I got two divs, one for sidebar and one for content. I would like the sidebar to be, well, at the side, but when both are present the content always goes below the sidebar, unless I put that in position:absolute. In that case I have a problem when small screens are used, 'cause they get one over the other.
I paste the code, hope you can help!
/* This is for content */
article, aside, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
#modal {
position: relative;
width: 100%;
display: inline-block;
display: table;
display: table-cell;
float: none;
border: 1px solid #CCC;
box-shadow: 0 1px 5px #CCC;
border-radius: 5px;
font-family: verdana;
margin: 25px auto;
text align: center;
background-color: #f2f2f2;
overflow: auto;
}
#modal header {
background: #f1f1f1;
background-image: -webkit-linear-gradient( top, #f1f1f1, #CCC );
background-image: -ms-linear-gradient( top, #f1f1f1, #CCC );
background-image: -moz-linear-gradient( top, #f1f1f1, #CCC );
background-image: -o-linear-gradient( top, #f1f1f1, #CCC );
box-shadow: 0 1px 2px #888;
padding: 10px;
}
#modal h1 {
padding: 0;
margin: 0;
font-size: 16px;
font-weight: normal;
text-shadow: 0 1px 2px white;
color: #323232;
text-align: center;
}
#modal section {
padding-right: 10px;
padding-left: 10px;
padding-bottom: 10px;
font-size: 12px;
line-height: 175%;
color: #333;
text-align: center;
}
while this is the sidebar
/*sidebar */
#sidebar{
position: static;
margin-top: 15px;
max-width: 150px;
}
#sidebar ul,
#sidebar ul li,
#sidebar ul ul {
list-style: none;
margin: 0;
padding: 0;
border: 0;
top: 5%;
}
#sidebar ul {
position: static;
top: 90px;
z-index: 1000;
}
#sidebar ul li {
min-height: 1px;
line-height: 1em;
vertical-align: middle;
}
#sidebar ul li.hover,
#sidebar ul li:hover {
position: relative;
z-index: 599;
cursor: default;
}
#sidebar ul ul {
margin-top: 1px;
visibility: hidden;
position: absolute;
top: 1px;
left: 99%;
z-index: 598;
width: 100%;
}
#sidebar ul ul li {
float: none;
}
#sidebar ul ul ul {
top: 1px;
left: 99%;
}
#sidebar ul li:hover > ul {
visibility: visible;
}
#sidebar ul li {
float: none;
}
#sidebar ul ul li {
font-weight: normal;
}
/* Custom CSS Styles */
#sidebar {
font-family: 'Lato', sans-serif;
font-size: 18px;
width: 180px;
}
#sidebar ul a,
#sidebar ul a:link,
#sidebar ul a:visited {
display: block;
color: #000000;
text-decoration: none;
font-weight: 300;
}
#sidebar > ul {
float: none;
}
#sidebar ul {
background: #a0a0a0;
}
#sidebar > ul > li {
border-left: 3px solid #000000;
}
#sidebar > ul > li > a {
padding: 10px 20px;
}
#sidebar > ul > li:hover {
border-left: 3px solid #9b1a1c;
}
#sidebar ul li:hover > a {
color: #9b1a1c;
}
#sidebar > ul > li:hover {
background: #f6f6f6;
}
/* Sub Menu */
#sidebar ul ul a:link,
#sidebar ul ul a:visited {
font-weight: 400;
font-size: 14px;
}
#sidebar ul ul {
width: 180px;
background: none;
border-left: 20px solid transparent;
}
#sidebar ul ul a {
padding: 8px 0;
border-bottom: 1px solid #eeeeee;
}
#sidebar ul ul li {
padding: 0 20px;
background: #fff;
}
#sidebar ul ul li:last-child {
border-bottom: 3px solid #000000;
padding-bottom: 10px;
}
#sidebar ul ul li:first-child {
padding-top: 10px;
}
#sidebar ul ul li:last-child > a {
border-bottom: none;
}
#sidebar ul ul li:first-child:after {
content: '';
display: block;
width: 0;
height: 0;
position: absolute;
left: -20px;
top: 13px;
border-left: 10px solid transparent;
border-right: 10px solid #fff;
border-bottom: 10px solid transparent;
border-top: 10px solid transparent;
}
I'm working on the stylesheet for a wordpress template (http://newwpthemes.com/techzilla-free-wordpress-theme/). I would like the links in the "secondary menu" to be left aligned. I have tried to add float: left; where I think it should be, but so far it has not worked. You can see an example here: http://www.hafdal.dk/ - it is the menu that is placed below the slideshow. Any idea where I need to modify the stylesheet? I had to cut parts of the stylesheet out but I left the ones related to the menus.
/*
Theme Name: TechZilla
Theme URI: http://newwpthemes.com/techzilla-free-wordpress-theme/
Description: Free News/Magazine WordPress theme by NewWpThemes
Author: NewWpThemes
Author URI: http://newwpthemes.com
Version: 1.0
Tags: gray, red, three-columns, left-right-sidebars
*/
/* INDEX:
=GENERAL
=LAYOUT
=HEADER
=MENUS
=POST
=SITEMAP
=CONTACT FORM
=SLIDER
=WP-PAGENAVI
=FOOTER
=WIDGETS
=COMMENTS
/* =GENERAL
-------------------------------------------------------------- */
#import url(http://fonts.googleapis.com/css?family=Abel);
body {
background: url(images/background.png);
color: #555555;
}
a {
color: #EC2124;
text-decoration: underline;
}
a:hover, a:focus {
color: #000000;
text-decoration: none;
}
a:focus {
outline: none;
}
/* =LAYOUT
-------------------------------------------------------------- */
#container {
width: 1200px;
/* breytt úr 960px*/
margin: 0 auto;
}
#main {
padding: 15px;
background: #fff;
}
#main-fullwidth {
padding: 15px;
background: #fff;
}
#content {
overflow: hidden;
float: left;
width: 700px;
/* breytt úr 460px*/
margin-left: 235px;
/* breytt úr 235px*/
}
#sidebar-primary {
overflow: hidden;
float: left;
width: 220px;
margin-left: -935px;
/* breytt úr -695px*/
}
#sidebar-secondary {
overflow: hidden;
float: right;
width: 220px;
margin-left: 15px;
}
/* =HEADER
-------------------------------------------------------------- */
#header {
height: 60px;
padding:30px 0;
background: #FFFFFF;
}
.logo {
float: left;
margin: 2px 0 2px 15px;
}
.logo h1.site_title {
margin: 0;
padding:0;
font-family: Arial, Helvetica, Sans-serif;
font-size:48px;
line-height: 40px;
font-weight: bold;
}
.logo h1.site_title a, .logo h1.site_title a:hover {
color: #272324;
text-decoration: none;
}
.logo h2.site_description {
margin: 0;
padding:0;
color: #272324;
font-family: Arial, Helvetica, Sans-serif;
font-size:14px;
line-height: 14px;
}
.header-right {
float: right;
margin-right: 15px;
}
#top-social-profiles {
padding-top: 6px;
height: 32px;
text-align: right;
}
#top-social-profiles img {
margin: 0 0 0 6px !important;
}
#top-social-profiles img:hover {
opacity: 0.8;
}
#top-social-profiles .widget-container {
background: none;
padding: 0;
border: 0;
}
/* =MENUS
-------------------------------------------------------------- */
/* Menu Primary
----------------------------*/
.menu-primary-container {
float: left;
padding:0;
position:relative;
height: 34px;
z-index: 400;
margin-top: 7px;
}
.menu-primary {
}
.menu-primary ul {
min-width: 160px;
}
/* First Level - Menu Primary */
.menu-primary li a {
color: #666666;
padding: 10px 15px;
text-decoration: none;
font-family: 'Abel', sans-serif;
font-size: 13px;
text-transform: uppercase;
font-weight: normal;
background: #FFFFFF;
margin: 0 4px 0 0;
border-top: 2px solid #FFFFFF;
}
.menu-primary li a:hover, .menu-primary li a:active, .menu-primary li a:focus,
.menu-primary li:hover > a, .menu-primary li.current-cat > a, .menu-primary li.current_page_item > a, .menu-primary li.current-menu-item > a {
color: #E82425;
outline: 0;
border-top: 2px solid #E82425;
}
/* Child Levels - Menu Primary */
.menu-primary li li a {
color: #fff;
text-transform: none;
background: #666666;
padding: 10px 15px;
margin: 0;
border: 0;
font-weight: normal;
border-top:0;
}
.menu-primary li li a:hover, .menu-primary li li a:active, .menu-primary li li a:focus,
.menu-primary li li:hover > a, .menu-primary li li.current-cat > a, .menu-primary li li.current_page_item > a, .menu-primary li li.current-menu-item > a {
color: #fff;
background: #7F7F7F;
outline: 0;
border-bottom:0;
text-decoration: none;
border-top:0;
}
/* Arrows Menu Primary */
.menu-primary a.sf-with-ul {
padding-right: 20px;
min-width: 1px;
}
.menu-primary .sf-sub-indicator {
position: absolute;
display: block;
overflow: hidden;
right: 0;
top: 0;
padding: 9px 10px 0 0;
}
.menu-primary li li .sf-sub-indicator {
padding: 9px 10px 0 0;
}
/* Shadows Menu Primary */
.wrap-menu-primary .sf-shadow ul {
background: url('images/menu-primary-shadow.png') no-repeat bottom right;
}
/* Menu Secondary
----------------------------*/
.menu-secondary-container {
position:relative;
height: 38px;
z-index: 300;
background: url(images/menu-secondary-bg.png) left top repeat-x;
}
.menu-secondary {}
.menu-secondary ul {
min-width: 160px;
}
/* First Level - Menu Secondary */
.menu-secondary li a {
color: #FFFFFF;
padding: 10px 15px 14px 15px;
text-decoration: none;
font-family: 'Abel', sans-serif;
font-size: 14px;
text-transform: uppercase;
font-weight: bold;
}
.menu-secondary li a:hover, .menu-secondary li a:active, .menu-secondary li a:focus,
.menu-secondary li:hover > a, .menu-secondary li.current-cat > a, .menu-secondary li.current_page_item > a, .menu-secondary li.current-menu-item > a {
color: #FFFFFF;
background: url(images/menu-secondary-bg.png) left -138px repeat-x;
outline: 0;
}
/* Child Levels - Menu Secondary */
.menu-secondary li li a {
color: #fff;
background: #414141;
padding: 10px 15px;
text-transform: none;
margin: 0;
font-weight: normal;
}
.menu-secondary li li a:hover, .menu-secondary li li a:active, .menu-secondary li li a:focus,
.menu-secondary li li:hover > a, .menu-secondary li li.current-cat > a, .menu-secondary li li.current_page_item > a, .menu-secondary li li.current-menu-item > a {
color: #fff;
background: #EC2124;
outline: 0;
}
/* Arrows - Menu Secondary */
.menu-secondary a.sf-with-ul {
padding-right: 26px;
min-width: 1px;
}
.menu-secondary .sf-sub-indicator {
position: absolute;
display: block;
overflow: hidden;
right: 0;
top: 0;
padding: 9px 13px 0 0;
}
.menu-secondary li li .sf-sub-indicator {
padding: 9px 13px 0 0;
}
/* Shadows - Menu Secondary */
.wrap-menu-secondary .sf-shadow ul {
background: url('images/menu-secondary-shadow.png') no-repeat bottom right;
}
/* =POST
-------------------------------------------------------------- */
/* Post General
----------------------------*/
.post {
margin-bottom: 15px;
}
.page, .post-single {
border-bottom: 0;
margin-bottom: 0;
}
.title {
color: #333333;
margin: 0 0 10px 0;
padding: 0;
font-family: 'Abel', sans-serif;
font-size: 24px;
line-height: 24px;
font-weight: bold;
}
.title a {
color: #333333;
text-decoration: none;
}
.title a:hover {
color: #EC2124;
text-decoration: none;
}
.entry {
line-height: 20px;
}
.featured_image {
padding: 6px;
border: 1px solid #ccc;
background: #fff;
}
.page-title {
color: #333;
margin: 0px 0 10px 0;
padding: 0 0 10px 0;
font-weight: bold;
text-transform: uppercase;
font-size: 20px;
font-family: Arial, Helvetica, Sans-serif;
border-bottom: 2px solid #ddd;
}
/* Post Metas
----------------------------*/
.postmeta-primary {
color: #999999;
font-size: 12px;
line-height: 18px;
padding: 0 0 10px 0;
}
.postmeta-secondary {
color: #999999;
font-size: 12px;
line-height: 18px;
padding: 0 0 10px 0;
}
.postmeta-primary span, .postmeta-secondary span {
background: url(images/meta-separator.png) left center no-repeat;
padding:3px 0 3px 10px;
}
.postmeta-primary span:first-child, .postmeta-secondary span:first-child {
background: none;
padding-left: 0;
}
/* Read More
----------------------------*/
.readmore {
margin-bottom: 15px;
float: right;
}
.readmore a {
color: #6D6D6D;
background: #F2F2F2;
padding: 8px 14px;
font-size: 12px;
line-height: 12px;
display: inline-block;
text-decoration: none;
text-transform: uppercase;
}
.readmore a:hover {
color: #fff;
background: #EC2124;
text-decoration: none;
}
/* =SITEMAP
-------------------------------------------------------------- */
.sitemap {
}
.sitemap-col {
width: 30%;
padding: 0 0 0 10px;
}
.sitemap-col-archives {
width: 45%;
padding: 0 0 0 10px;
}
.sitemap h2 {
font-size: 18px;
font-weight: bold;
border-bottom: 2px solid #ddd;
padding: 0 0 10px 0;
margin: 0 0 10px 0;
}
.sitemap h3 {
font-size: 14px;
font-weight: bold;
padding: 0;
margin: 0 0 10px 0;
}
.sitemap-list {
font-size: 13px;
line-height: 22px;
}
.sitemap-list, .sitemap-list ul {
padding: 0 0 0 20px;
}
/* =CONTACT FORM
-------------------------------------------------------------- */
.contact-form {
}
.contact-form-label {
width: 90px;
font-weight: bold;
font-size: 14px;
padding: 7px 0;
}
.contact-form-input {
margin-left: 90px;
}
.contact-form input[type=text] {
padding: 6px;
width: 60%;
margin-bottom: 20px;
border: 1px solid #ccc;
background: #fff;
}
.contact-form input[type=submit] {
padding: 5px 50px;
border: 1px solid #ccc;
background: #eee;
}
.contact-form textarea {
width: 96%;
padding: 6px;
height: 160px;
margin-bottom: 20px;
border: 1px solid #ccc;
background: #fff;
}
.contact-form-required {
color: red;
}
/* =SLIDER
-------------------------------------------------------------- */
.fp-slider {
margin: 0 0 15px 0;
}
.fp-slides-container {}
.fp-slides, .fp-thumbnail, .fp-prev-next, .fp-nav {
width: 1170px;
/* breytt úr 930px*/
}
.fp-slides, .fp-thumbnail {
height: 300px;
overflow: hidden;
position: relative;
}
.fp-title {
font-family: Arial, Helvetica, Sans-serif;
color: #fff;
font-size: 18px;
font-weight: bold;
padding: 0 0 2px 0;
margin: 0;
}
.fp-title a, .fp-title a:hover {
color: #fff;
text-decoration: none;
}
.fp-content {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: #111;
opacity: 0.7;
filter: alpha(opacity = 70);
padding: 10px 15px;
overflow: hidden;
}
.fp-content p {
color: #fff;
padding: 0;
margin: 0;
line-height: 18px;
}
.fp-more, .fp-more:hover{
color: #fff;
font-weight: bold;
}
.fp-nav {
height: 12px;
text-align: center;
padding: 10px 0;
background: #333;
}
.fp-pager a {
background-image: url(images/featured-pager.png);
cursor:pointer;
margin: 0 8px 0 0;
padding: 0;
display: inline-block;
width: 12px;
height: 12px;
overflow: hidden;
text-indent: -999px;
background-position: 0 0;
float: none;
line-height: 1;
opacity: 0.7;
filter: alpha(opacity = 70);
}
.fp-pager a:hover, .fp-pager a.activeSlide {
text-decoration: none;
background-position: 0 -112px;
opacity: 1.0;
filter: alpha(opacity = 100);
}
.fp-prev-next-wrap {
position: relative;
z-index: 200;
}
.fp-prev-next {
position: absolute;
bottom: 130px;
left: 0;
right: 0;
height: 37px;
}
.fp-prev {
float:left;
margin-left: 14px;
width:37px;
height:37px;
background:url(images/featured-prev.png) left top no-repeat;
opacity: 0.6;
filter: alpha(opacity = 60);
}
.fp-prev:hover {
opacity: 0.8;
filter: alpha(opacity = 80);
}
.fp-next {
float:right;
width:36px;
height:37px;
margin-right: 14px;
background:url(images/featured-next.png) right top no-repeat;
opacity: 0.6;
filter: alpha(opacity = 60);
}
.fp-next:hover {
opacity: 0.8;
filter: alpha(opacity = 80);
}
/* =WP-PAGENAVI
-------------------------------------------------------------- */
.wp-pagenavi {
float: left;
}
.wp-pagenavi a, .wp-pagenavi span {
text-decoration: none;
padding: 5px 8px;
margin: 2px;
font-size: 15px;
line-height: 15px;
float: left;
}
.wp-pagenavi a, .wp-pagenavi a:link, .wp-pagenavi a:active {
color: #333333;
background:none;
}
.wp-pagenavi span.current {
font-weight: bold;
color: #fff;
background:#EC2124;
}
.wp-pagenavi a:hover {
color: #333333;
background:#DEDEDE;
}
.wp-pagenavi span.pages {
color: #333333;
background: none;
padding: 4px 8px 4px 0;
}
.wp-pagenavi span.extend {
background:transparent;
color: #333333;
background: none;
}
/* =FOOTER
-------------------------------------------------------------- */
#footer {
margin:10px 0 15px 0;
}
#copyrights {
color: #434141;
background: #FFFFFF;
text-align: center;
padding: 20px 0;
}
#copyrights a {
color: #434141;
}
#copyrights a:hover {
color: #434141;
text-decoration: none;
}
#credits {
color: #717171;
text-align: center;
font-size: 11px;
padding: 10px 0 0 0;
}
#credits a {
color: #717171;
text-decoration: none;
}
#credits a:hover {
text-decoration: none;
color: #717171;
}
/* Footer Widgets
----------------------------*/
#footer-widgets {
background: #FFFFFF;
padding: 20px 0 0 0;
margin-top: 6px;
}
.footer-widget-box {
width: 400px;
/* breytt úr 300px*/
float: left;
margin-left: 15px;
}
.footer-widget-box-last {
}
/* Footer Widgets Color */
#footer-widgets .widget-container {
}
/* Footer Widgets Links */
#footer-widgets .widget-container a {
}
#footer-widgets .widget-container a:hover {
}
/* Footer Widget Title */
#footer-widgets .widgettitle {
}
#footer-widgets .widgettitle, #footer-widgets .widgettitle a, #footer-widgets .widgettitle a:hover {
}
/* Footer List Items */
#footer-widgets .widget ul li {
}
/* Footer Widgets Tabs */
#footer-widgets .tabs-widget li a {
}
#footer-widgets .tabs-widget li a:hover, #footer-widgets .tabs-widget li a.tabs-widget-current {
}
/* Footer Widgets Seaarch */
#footer-widgets #search {
}
#footer-widgets #search #s {
}
/* =WIDGETS
-------------------------------------------------------------- */
/* Widgets Defaults
----------------------------*/
.widget-container {
list-style-type: none;
list-style: none;
margin: 0 0 15px 0;
padding: 0;
color: #666666;
font-size: 13px;
}
.widget-container a {
color: #666666;
text-decoration: none;
}
.widget-container a:hover {
color: #478AF8;
text-decoration: none;
}
.widgettitle {
background: url(images/background.png) left top repeat-x;
margin: 0 0 10px 0;
padding: 8px 0 8px 10px;
border-left: 4px solid #EC2124;
}
.widgettitle, .widgettitle a, .widgettitle a:hover {
color: #414445;
font-size: 20px;
line-height: 20px;
font-family: 'Abel', sans-serif;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
}
.widget ul {
list-style-type: none;
list-style: none;
margin: 0;
padding: 0;
}
.widget ul li {
padding: 0 0 9px 0px;
margin: 0 0 8px 0;
}
/* Search
----------------------------*/
#search {
border: 1px solid #D8D8D8;
background: #fff url(images/search.png) 99% 50% no-repeat;
text-align: left;
padding: 6px 24px 6px 6px;
}
#search #s {
background: none;
color: #979797;
border: 0;
width: 100%;
padding: 0;
margin: 0;
outline: none;
}
#content-search {
width: 300px;
padding: 15px 0;
}
/* Wp Calendar
----------------------------*/
#wp-calendar td:hover, #wp-calendar #today {
background: #478AF8;
color: #fff;
}
#wp-calendar td:hover a, #wp-calendar #today a {
color: #fff;
}
/* Text Widget
----------------------------*/
.textwidget {
line-height: 18px;
}
/* 125x125 Banners Widget
----------------------------*/
.banners-125 {
text-align: center;
margin-bottom: -10px;
}
.banners-125 img {
margin: 0 5px 5px 5px;
}
/* Posts Widget
----------------------------*/
.posts-widget ul {
list-style-type: none;
list-style: none;
padding: 0;
margin: 10px 0 0 0;
}
.posts-widget ul li {
list-style-type: none;
list-style: none;
padding: 0 0 15px 0;
margin: 0 0 15px 0;
}
.posts-widgettitle {
font-weight: bold;
padding: 0 0 5px 0;
margin: 0;
font-family: Arial, Helvetica, Sans-serif;
font-size: 14px;
}
.posts-widgettitle a {}
.posts-widgettitle a:hover {}
.posts-widget-meta {
font-style: italic;
padding: 0 0 5px 0;
}
.posts-widget-entry {
font-family: Arial, Helvetica, Sans-serif;
line-height: 20px;
}
.posts-widget-more {
font-weight: bold;
}
.posts-widget-more:hover {}
.posts-widget-featured-image {
border: 1px solid #ddd;
padding: 4px;
background-color: #fff;
}
.posts-widget .alignleft {
margin: 0 8px 8px 0;
}
.posts-widget .alignright {
margin: 0 0 8px 8px;
}
.posts-widget .aligncenter {
margin-bottom: 8px;
}
/* Comments Widget
----------------------------*/
.comments-widget ul {
list-style-type: none;
list-style: none;
padding: 0;
margin: 10px 0 0 0;
}
.comments-widget ul li {
list-style-type: none;
list-style: none;
padding: 0 0 10px 0;
margin: 0 0 10px 0;
}
.comments-widget-author {
text-decoration: none;
font-weight: bold;
padding: 0 0 5px 0;
margin: 0;
}
.comments-widget-author:hover {}
.comments-widget-entry {
font-family: Arial, Helvetica, Sans-serif;
line-height: 20px;
}
.comments-widget-more {
font-weight: bold;
}
.comments-widget-more:hover {}
.comments-widget-avatar {
border: 1px solid #ddd;
padding: 4px;
background-color: #fff;
}
.comments-widget .alignleft {
margin: 0 8px 0 0;
}
.comments-widget .alignright {
margin: 0 0 0 8px;
}
.comments-widget .aligncenter {
margin-bottom: 8px;
}
/* Info Box Widget
----------------------------*/
.infobox-widget ul {
list-style-type: none;
list-style: none;
padding: 0;
margin: 0;
}
.infobox-widget ul li {
list-style-type: none;
list-style: none;
padding: 0;
margin: 5px 0 0 0;
}
.infobox-widget ul li a {
text-decoration: none;
}
.infobox-widget-description {
line-height: 20px;
}
.infobox-widget-more {
font-weight: bold;
}
.infobox-widget-more:hover {
}
.infobox-widget .alignleft {
margin: 0 10px 10px 0;
}
.infobox-widget .alignright {
margin: 0 0 10px 10px;
}
.infobox-widget .aligncenter {
margin-bottom: 10px;
}
.infobox-widget .inbottom {
margin-top: 10px;
}
/* Social Profiles Widget
----------------------------*/
.social-profiles-widget img {
margin: 0 4px 0 0;
}
.social-profiles-widget img:hover {
opacity: 0.8;
}
/* Tabs Widget
----------------------------*/
.tabs-widget {
list-style: none;
list-style-type: none;
margin: 0 0 10px 0;
padding: 0;
height: 26px;
}
.tabs-widget li {
list-style: none;
list-style-type: none;
margin: 0 0 0 4px;
padding: 0;
float: left;
}
.tabs-widget li:first-child {
margin: 0;
}
.tabs-widget li a {
color: #EC2124;
background: url(images/tabs-bg.png) left top repeat-x;
padding: 6px 16px;
font-family: Arial, Helvetica, Sans-serif;
font-weight: bold;
display: block;
text-decoration: none;
font-size: 12px;
line-height: 12px;
}
.tabs-widget li a:hover, .tabs-widget li a.tabs-widget-current {
background: #EC2124;
color: #fff;
}
.tabs-widget-content {
}
/* Tweets Widget
----------------------------*/
.tweets-widget ul {
list-style-type: none;
list-style: none;
margin: 0;
padding: 0;
line-height: 20px;
font-family: Arial, Helvetica, Sans-serif;
}
.tweets-widget ul li {
list-style-type: none;
list-style: none;
padding: 0;
margin: 15px 0 0 0;
}
.tweets-widget ul li:first-child {
margin-top: 5px;
}
.tweets-widget li.tweets-bird {
padding-left: 24px;
background: url(images/tweets.png) left 2px no-repeat;
}
.tweets-widget a {}
.tweets-widget a:hover {}
a.tweets-widget-time {
text-decoration: underline;
}
a.tweets-widget-time:hover {
text-decoration: none;
}
/* Facebook Widget
----------------------------*/
.facebook-widget {
list-style-type: none;
list-style: none;
margin: 0;
padding: 0;
}
/* Children */
.commentlist .children li {
border: none;
margin: 0;
}
.nocomments {
display: none;
}
#comments .pingback {
margin-bottom: 18px;
padding-bottom: 18px;
}
.commentlist li.comment+li.pingback {
margin-top: -6px;
}
#comments .pingback p {
font-size: 12px;
line-height: 18px;
display:block;
margin: 0;
}
#comments .pingback .url {
font-style: italic;
font-size: 13px;
}
/* =END
-------------------------------------------------------------- */
You want to have the contents of the menu-secondary-container div left aligned?
Looks like those links (Genealogy, Íslenska, English and Dansk) aren't floating under the logo image. Try adding this to your css:
.menu-secondary-container {
clear: both;
}
My site is http://farmersforum.in which is not displaying properly on ipad and iphone. The header and footer and left aligned but the body is right aligned and starts from where the header ends.
the #container width is 1020px so i dont think that is the problem. Here's the css code;
/*
Theme Name: gazpoMag
Theme URI: gazpo.com
Description: gazpoMag is a clean and featured-rich Wordpress magazine style theme. It allows you to easily customize every detail of the theme to best suit your needs.
Author: Sami Ch.
Author URI: http://www.gazpo.com
License: GNU General Public License
License URI: license.txt
*/
* {
padding:0;
margin:0;
}
body{
color: #333333;
font-family: Arial, Helvetica, sans-serif;
line-height: 20px;
font-size: 12px;
}
ol, ul {
list-style: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
a, a:visited{
text-decoration: none;
color: #004A8D;
}
a:hover{
text-decoration: underline;
color: #004A8D;
}
a { outline: none; }
h2, h3, h4{
font-family: 'Helvetica', Arial;
color: #222;
text-shadow: 0px 0px 1px #ccc;
}
h2{
font-size:16px;
margin:10px 0 3px;
}
h3{
font-size: 16px;
}
h4{
font-size: 16px;
}
h2 a, h2 a:visited{
color:#004A8D;
font-size:16px;
}
h2 a:hover{
text-decoration: none;
color:#133451;
}
a img {
border: none;
}
img.centered {
display: block;
margin-left: auto;
margin-right: auto;
}
img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}
img.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}
.alignright {
float: right;
}
.alignleft {
float: left;
}
#container{
margin: 0 auto;
width: 1020px;
text-align: left;
overflow:auto;
background:#ffffff;
}
#header {
background: url("images/bg.png") repeat-x;
}
#header .wrap{
background: url("images/bg.png") repeat-x;
width: 1020px;
height: 120px;
margin:0 auto;
}
#header .logo{
margin-top:7px;
width: 420px;
float:left;
overflow:hidden;
display:table;
}
#header .logo img{
max-width: 415px;
max-height:110px;
}
#header .logo .text{
display:table-cell;
vertical-align:middle;
}
#header .logo h1 a{
font-family: 'Droid Serif', Arial;
font-size:44px;
line-height:0.9;
color:rgba(241,244,245,.7) ;
font-weight: bold;
text-shadow:1px 1px rgba(202,216,221,.7),
2px 2px rgba(202,216,221,.7),
3px 3px rgba(202,216,221,.7);
}
#header .logo h1 a:hover{
text-decoration:none;
}
#header .right{
margin-top:10px;
width: 546px;
float:left;
margin-left: 50px;
}
#header .links {
margin-bottom:10px;
overflow:auto;
}
#header .links ul{
overflow:auto;
color:white;
float:right;
}
#header .links ul li{
float: left;
margin-left:8px;
}
#header .links ul li a {
color: #DAE5EC;
padding-right:8px;
font-size:13px;
font-weight:bold;
}
#header .twitter{
background: url("") no-repeat;
padding-left:55px;
font-family:'Droid Serif', serif;
font-size:14px;
min-height:40px;
max-height:60px;
overflow:hidden;
}
#header #twitter_update_list{
color:#cccccc;
}
#header #twitter_update_list a{
color: #DAE5EC;
}
#subheader{
background: url("images/subheader.png") repeat-x;
}
#subheader .wrap{
width: 1020px;
margin:0 auto;
background: url("images/subheader.png") repeat-x;
height:40px;
text-transform:uppercase;
font-weight:bold;
color: #7B7B7B;
line-height:40px;
}
#subheader ul li{
float: left;
margin-right:25px;
}
#subheader .categories{
width:780px;
float:left;
}
#subheader .search{
width:236px;
float:left;
}
#subheader .search input {
font: normal 14px/100% Arial, Helvetica, sans-serif;
}
#subheader .search .searchfield {
background: #fff;
padding: 7px 6px 7px 8px;
width: 220px;
border: solid 1px #bcbbbb;
outline: none;
margin-top:4px;
border-radius: 15px;
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
}
#content{
float: left;
width: 716px;
overflow: auto;
}
#featured-cat{
overflow: auto;
margin: 10px 10px 5px;
border-bottom:1px solid #D4D4D4;
}
#featured-cat .cat-title{
background:#f6f6f6;
border-bottom:1px solid #dbdbdb;
padding:5px;
margin-bottom:5px;
}
#featured-cat .box{
width:220px;
float:left;
overflow:hidden;
}
#featured-cat .margin-right{
margin-right:15px;
}
#featured-cat .thumb{
position:relative;
float:left;
width:220px;
height:130px;
overflow:hidden;
}
#featured-cat .date{
position:absolute;
background: #000000;
color: #FFFFFF;
display: block;
font-size: 12px;
font-weight: 700;
opacity: 0.7;
padding: 2px 5px 4px 5px;
top: 20px;
}
#featured-cat .details{
margin-bottom:10px;
clear:both;
padding-top: 8px;
}
#content .post{
overflow: auto;
margin: 10px 10px 5px 0px;
}
#content .s_socialbar{
margin-top:30px;
margin-left: -80px;
display: block;
position: absolute;
background:#ECF5FA;
border-radius:7px;
}
#content .s_socialbar ul{
margin:10px 5px 0px 5px;
}
#content .s_socialbar ul li{
margin-bottom:10px;
}
#content .s_socialbar .fb-like{
margin:0px 0px 4px 4px;
}
#content .post .postmeta {
overflow:auto;
padding:2px;
font-size:12px;
color: #777777;
}
#content .post .postmeta .comments{
float:right;
margin-right: 10px;
background:url(images/comments.png) no-repeat left center;
padding-left:20px;
}
#content .wp-post-image{
background-color: #F3F3F3;
border: 1px solid #DDDDDD;
border-radius: 3px 3px 3px 3px;
}
#content .entry img{
max-width: 97.5%;
height:auto;
border:1px solid #ddd;
padding:2px
background-color:#f3f3f3;
margin:5px 10px 5px 0;
}
#content .thumb-twitter-entry{
overflow:auto;
width: 420px;
float:left;
}
#content .thumb-entry{
float:left;
width: 489px;
}
#content .twitter-entry{
float:left;
width: 635px;
}
#content .entry{
overflow:auto;
margin-bottom:20px;
}
#content .post-twitter{
width: 60px;
float:left;
margin:15px 0px 0px 5px;
}
#content .wp-caption{
border:1px solid #ddd;
text-align:center;
background-color:#f3f3f3;
padding-top:4px;
margin:10px 5px;
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
}
#content .wp-caption img{
margin:0;
padding:0;
border:0 none;
}
#content .wp-caption p.wp-caption-text{
font-size:11px;
line-height:17px;
padding:0 4px 5px;
margin:0;
}
#content .entry blockquote{
background: url("images/quote.png") no-repeat;
font-family: "Georgia", Arial, Helvetica, sans-serif;
color: #777777;
margin: 5px 5px 10px 25px;
padding-left: 32px;
padding-top: 3px;
font-style:italic;
}
#content .entry ul{
list-style-type:square;
margin: 5px 10px 10px 40px;
}
#content .entry ol{
list-style-type:decimal;
margin: 5px 10px 10px 40px;
}
#sidebar{
float: left;
width: 300px;
padding-top:10px;
}
#sidebar h4{
padding: 4px 0px 4px 24px;
border-bottom:1px solid #dbdbdb;
}
#sidebar .box{
margin-bottom:10px;
border-bottom: 1px solid #EFEFEF;
padding:5px;
}
#sidebar_social{
overflow:auto;
margin:10px 0;
}
#sidebar_social a{
font-size: 12px;
font-weight: bold;
padding: 50px 5px 0px;
}
#sidebar_social ul{
overflow:auto;
}
#sidebar_social ul li{
width:70px;
float:left;
padding-top:50px;
text-align: center;
overflow:auto;
}
#sidebar .widget_categories{
margin-bottom: 10px;
}
#sidebar .widget_categories h4{
background:#f6f6f6 url('images/tag.png') no-repeat 5px center;
}
#sidebar .widget_categories ul, #footer .widget_categories ul{
overflow:auto;
padding:10px 5px;
margin: 5px;
}
#sidebar .widget_categories ul li, #footer .widget_categories ul li{
margin-right:8px;
float: left;
font-size: 12px;
margin-bottom: 10px;
}
#sidebar .widget_categories ul li a, #footer .widget_categories ul li a{
background-color: #f6f6f6;
border-bottom: 1px solid #DBDBDB;
border-right: 1px solid #DBDBDB;
color: #777777;
padding: 3px 6px;
text-decoration: none;
white-space: nowrap;
}
#sidebar .widget_categories ul li a:hover,#footer .widget_categories ul li a:hover{
text-decoration: none;
background: #E8E8E8;
}
#sidebar .widget_archive h4{
background:#f6f6f6 url('images/calendar.png') no-repeat 5px center;
}
#sidebar .widget_archive ul, #sidebar .widget_links ul{
padding:5px;
}
#sidebar .widget_archive ul li, #sidebar .widget_links ul li{
padding:3px 0px 3px 12px;
background:url(images/cat_bullet.png) no-repeat left center;
}
#sidebar .widget_links h4{
background:#f6f6f6 url('images/bookmarks.png') no-repeat 5px center;
}
#sidebar .widget_subscribers{
margin-bottom:10px;
}
#sidebar .widget_subscribers .counts{
margin:15px;
overflow:auto;
}
#sidebar .widget_subscribers .counts img{
vertical-align:middle;
}
#sidebar .widget_subscribers .fb{
float:left;
margin-right: 20px;
margin-left:25px;
}
#sidebar .widget_subscribers .twitter{
float:left;
}
#sidebar .widget_subscribers .count{
display: inline-block;
font-size: 22px;
font-weight: bold;
vertical-align: middle;
}
#sidebar .widget_subscribers .count a{
color: #404040 !important;
}
#sidebar .widget_subscribers .count a:hover{
text-decoration:none;
}
#sidebar .widget_posts{
margin-bottom:10px;
}
#sidebar .widget_posts ul.tabs {
height: 30px;
line-height: 24px;
list-style: none;
background: #FFF;
background:url(images/sidebar_posts.png) no-repeat top center;
font-size: 14px;
font-weight: bold;
font-family: 'Droid Serif', Arial;
border-bottom: 1px solid #D4D4D4;
}
#sidebar .widget_posts .tabs li {
float: left;
padding-top:3px;
color: #777;
cursor: pointer;
padding-left: 24px;
}
#sidebar .widget_posts .tabs li:hover {
color: #333333;
text-shadow: 0px 0px 1px #ccc;
}
#sidebar .widget_posts .tabs li.current {
color: #333333;
text-shadow: 0px 0px 1px #ccc;
}
#sidebar .widget_posts .post_box.visible {
display: block;
}
#sidebar .widget_posts .tabs li.recent{
background:#f6f6f6 url('images/calendar1.png') no-repeat 5px center;
margin-right:5px;
width:65px;
}
#sidebar .widget_posts .tabs li.popular{
background:#f6f6f6 url('images/heart.png') no-repeat 5px center;
margin-right:5px;
width:70px;
}
#sidebar .widget_posts .tabs li.comments{
background:#f6f6f6 url('images/comments.png') no-repeat 5px center;
width:80px;
}
#sidebar .widget_posts .posts-list li{
margin-bottom:5px;
font-size: 12px;
overflow:auto;
padding-bottom:5px;
}
#sidebar .widget_posts .post_box {
display: none;
border-width: 0 1px 1px;
padding: 5px;
height:255px;
}
#sidebar .widget_posts .info{
float:left;
width:210px;
}
#sidebar .widget_posts .meta {
font-style:italic;
}
#sidebar .widget_posts .meta .date{
float:left;
}
#sidebar .widget_posts .meta .cmts{
float:right;
margin-right: 10px;
background:url(images/comment.png) no-repeat left center;
padding-left:20px;
font-style:normal;
}
#sidebar .widget_posts .posts-list li .title{
font-weight:bold;
}
#sidebar .widget_posts .thumb{
width: 60px;
height: 40px;
float:left;
margin-right:5px;
}
#sidebar .widget_posts .avatar-42{
width: 42px;
height: 42px;
float:left;
margin-right:5px;
}
#sidebar .widget_posts .comment-info{
float:left;
width:230px;
}
#sidebar .widget_posts .comment-info p{
line-height:15px;
}
#sidebar .widget_facebook h4{
background:#f6f6f6 url('images/facebook.png') no-repeat 5px center;
}
#sidebar .widget_facebook{
margin-bottom:10px;
}
#sidebar .widget_text h4{
background:#f6f6f6 url('images/about.png') no-repeat 5px center;
margin-bottom:5px;
}
#sidebar .widget_text {
margin-bottom:10px;
}
#footer .widget_text h4{
background:url('images/about.png') no-repeat 12px center;
margin-bottom:5px;
}
#sidebar .widget_ad125{
margin-bottom:10px;
overflow:auto;
}
#sidebar .widget_ad125 h4{
background:#f6f6f6 url('images/star.png') no-repeat 5px center;
margin-bottom:5px;
}
#sidebar .widget_ad125 li{
float:left;
margin:10px 10px;
}
#sidebar .widget_ad125 li img{
width:125px;
height:125px;
}
#footer {
background: url("images/bg.png") repeat;
}
#footer .wrap{
width: 1020px;
margin:0 auto;
padding:10px;
overflow:auto;
color: #CCCCCC;
}
#footer .main{
overflow:auto;
padding-bottom:5px;
}
#footer .box{
float: left;
width:330px;
}
#footer .info{
font-size:12px;
}
#footer h4{
padding-left:32px;
margin-bottom:5px;
color: #CCCCCC;
text-shadow:none;
}
#footer a{
color: #DAE5EC;
}
#footer .widget_text{
margin-bottom:10px;
padding: 0 20px;
}
#footer .widget_links ul, #footer .widget_archive ul, #footer .widget_categories ul{
padding:0px 15px;
}
#footer .widget_links h4{
background:url('images/bookmarks.png') no-repeat 12px center;
}
#footer .widget_archive h4{
background:url('images/calendar.png') no-repeat 12px center;
}
#footer .widget_categories h4{
background:url('images/tag.png') no-repeat 12px center;
}
#footer .widget_links, #footer .widget_archive, #footer .widget_categories, #footer .widget_text{
float: left;
width:298px;
margin-right:10px;
}
#footer .widget_links ul li, #footer .widget_archive ul li{
padding: 2px 0 2px 20px;
background:url(images/u.png) no-repeat left center;
}
#footer .widget_tweets{
width:298px;
float:left;
margin-right:30px;
}
#footer .widget_tweets h4.title{
background:url('images/twitter.png') no-repeat 12px center;
}
#footer .widget_social{
width:298px;
float: left;
margin-right:10px;
}
#footer .widget_social h4{
background:url('images/interact.png') no-repeat 12px center;
}
#sidebar .widget_social h4{
background:#f6f6f6 url('images/interact.png') no-repeat 5px center;
}
#sidebar .widget_social ul{
padding:10px 5px;
}
#footer .widget_social ul{
padding:0px 15px;
}
#footer .widget_social ul li{
padding: 2px 0 2px 20px;
}
#sidebar .widget_social ul li{
padding:4px 0px 4px 20px;
}
.widget_social ul li.facebook{
background:url(images/facebook.png) no-repeat left center;
}
.widget_social ul li.twitter{
background:url(images/twitter.png) no-repeat left center;
}
.widget_social ul li.gplus{
background:url(images/gplus.png) no-repeat left center;
}
.widget_social ul li.rss{
background:url(images/rss.png) no-repeat left center;
}
.widget_social ul li.contact{
background:url(images/email.png) no-repeat left center;
}
#gazpo-socialbar {
background: #E3EDF4;
border-color: #E3EDF4;
display: block;
margin-left: -65px;
position: fixed;
top: 200px;
width: 65px;
}
#respond .cancel-comment-reply{
float:right;
}
#comments h3, #content .comments h4 {
margin:10px 0px;
}
#comments ol.commentlist {
margin: 10px 0 20px 0;
list-style-type: none;
overflow: visible;
}
#comments li.comment {
margin-bottom: 10px;
}
#comments li.comment .comment-body {
margin-left: 65px;
position: relative;
min-height:60px;
}
#comments li.comment .comment-meta {
overflow: hidden;
float: left;
display: block;
width: 50%;
}
#comments li.comment .avatar {
position: absolute;
left: -65px;
padding: 3px;
border:1px solid #ddd;
background-color:#f3f3f3;
}
#comments .comment-awaiting-moderation{
color: red;
font-size:12px;
font-style:italic;
}
#comments li.comment p {
clear: both;
}
#comments li.comment cite, li.bypostauthor li.comment cite {
font-weight: bold;
font-style: normal;
padding-right:10px;
margin-right: 8px;
float: left;
}
#comments .commentmetadata, .commentmetadata a {
font-size: 12px;
color: #999;
}
#comments .commentmetadata a:hover {
color: #666;
text-decoration: none;
}
#comments .says {
display: none;
}
#comments .comment-meta {
margin: 0 0 10px;
line-height: 18px;
position: relative;
}
#comments li.comment .comment-body a.comment-reply-link {
display: block;
position: absolute;
right: 0;
top: 0px;
padding-right: 10px;
font-size: 12px;
}
#comments .children {
list-style-type: none;
margin: 10px 0 0px 30px;
}
#comments .children li.comment .comment-body {
margin-left: 70px;
position: relative;
min-height:60px;
}
#comments .children li.comment .avatar {
position: absolute;
left: -65px;
}
#respond {
margin-top:15px;
}
#commentform {
background: #f6f6f6;
border-radius: 3px;
padding: 15px 10px;
overflow:auto;
margin:20px 0px;
}
#commentform .fields-container{
overflow:auto;
margin-bottom:15px;
}
#commentform .info{
float: left;
margin-right: 15px;
width: 250px;
}
#commentform .info span{
font-style:italic;
}
#commentform label{
clear: both;
color: #667780;
display: block;
line-height: 24px;
}
#commentform input{
width: 240px;
border: 1px solid #CAD9E0;
color: #333333;
font-family: Arial, Helvetica, sans-serif;
font-size:14px;
margin-bottom: 6px;
padding: 8px 3px;
}
#commentform textarea {
height: 150px;
width:98%;
border: 1px solid #CAD9E0;
border-radius: 3px;
color: #333333;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
margin-bottom: 6px;
margin-top: 2px;
padding: 6px 3px;
}
#commentform .message{
float: left;
width: 410px;
}
#commentform .gazpo-button{
width: 80px;
padding: 6px 8px;
}
.gazpo-button{
border-radius: 6px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
cursor: pointer;
display: inline-block;
font: 14px/100% Arial,Helvetica,sans-serif;
margin: 0 2px;
outline: medium none;
padding: 5px 10px;
text-align: center;
text-decoration: none;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
vertical-align: baseline;
background: -moz-linear-gradient(center top , #FFFFFF, #EDEDED) repeat scroll 0 0 transparent;
border: 1px solid #B7B7B7;
color: #606060;
}
.gazpo-button:hover {
background: #ededed;
background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
background: -moz-linear-gradient(top, #fff, #dcdcdc);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
}
.gazpo-button:active {
color: #999;
background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
background: -moz-linear-gradient(top, #ededed, #fff);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff');
}
.pagination {
clear:both;
margin: 10px;
text-align:center;
font-family:Verdana,Tahoma,Arial;
font-size: 13px;
padding:4px 6px 4px 0;
background-color:#fff;
color:#313031;
}
.pagination span{
padding: 3px;
margin: 3px;
text-align:center;
}
.pagination a {
padding: 2px 5px 2px 5px;
margin-right: 4px;
border: 1px solid #9aafe5;
text-decoration: none;
color: #2e6ab1;
}
.pagination a:hover, .pagination a:active{
border: 1px solid #2b66a5;
color: #000;
}
.pagination .current{
padding: 2px 5px 2px 5px;
margin-right: 4px;
border: 1px solid navy;
font-weight: bold;
background-color: #2e6ab1;
color: #FFF;
}
just put these inside another div and make it 1020px wide, secure the position and max/min widths.
<div id="wrapper/container">
<div id="header"></div>
<div id="subheader"></div>
<div id="container"></div>
<div id="footer"></div>
</div>
Or re-make theme using responsive design with grid and nice columns.