Wordpress and Header Position

1 replies
Good evening.

Can someone please help me to take this code and put my header title in the middle of the page as well as make it black.

Here is the style.css file:

/*
Theme Name:Sea View
Theme URI: Wordpress Themes - Download free wordpress themes for your Wordpress blog or upload your own wpthemes,wordpress theme,wp theme.
Description: Wordpress Theme Sea View by <a href="http://www.themespack.com/">Themespack</a>.
Author: wonder
Author URI: Wordpress Themes - Download free wordpress themes for your Wordpress blog or upload your own wpthemes,wordpress theme,wp theme.
This theme was designed and built by WP Theme
The CSS, XHTML and design is released under GPL
GPL Licenses | Open Source Initiative

*/
body {
font: 75%/150% Verdana, Arial, Helvetica, sans-serif;
color: #2c2c2c;
background: #f3e9d2 ;
margin: 0px;
padding: 25px 0px 10px 0px;
}
a {
color: #e1b576;
text-decoration: none;
}
a:visited {
color: #e1b576;
text-decoration: none;
}
a:hover {
color: #000000;
text-decoration: none;
}
img {
border: none;
}
p {
padding: 0px 0px 15px;
margin: 0px;
}
h1 {
margin:0px;

padding-left: 0px;
height: 60px;
font: bold 36px/100% "Trebuchet MS", Tahoma, Arial;
color: #ffffff;
}
h1 a, h1 a:visited{
color: #ffffff;
text-decoration: none;
}
h1 a:hover{
color: #ffffff;
text-decoration: none;
}
h2 {
color: #043E01;
margin: 0px 0px 2px;
border-bottom: 1px dotted #DFD266;
font-size:12px;
font-family:Verdana, Arial, Helvetica, sans-serif;
padding-bottom: 3px;
}
h2 a, h2 a:visited {
color: #043E01;
text-decoration: none;
}
h2 a:hover {
color: #043E01;
text-decoration: none;
}
h3 {
color: #043E01;
font-size:12px;
font-family:Verdana, Arial, Helvetica, sans-serif;
margin: 10px 0px 5px;
border-bottom : 1px dotted #DFD266;

}
h4 {
color: #043E01;
font-size:12px;
font-family:Verdana, Arial, Helvetica, sans-serif;
margin: 10px 0px 5px;
border-bottom : 1px dotted #DFD266;

}
form {
margin:0px;
padding:0px;
}
#page {
margin: 0px auto;
width: 900px;
border-top: 10px solid #183000;
background: #FFFFFF ;
}
/* header area */
#header {
background: #f3e9d2 url(img/header.jpg) no-repeat;
height: 250px;
position: relative;
}
#headerlogo {
position: relative;
padding: 20px 0px 0px 35px;
height: 60px;
}
#headerlogo .description{
position: absolute;
left: 45px;
bottom: 3px;
color: #ffffff;
font-size: 16px;
}
#nav {
list-style: none;
margin: 0px;
position: absolute;
left: 0px;
top: -28px;

}
#nav li {
float: left;
margin-left: 5px;
}
#nav .current_page_item a, #nav .current_page_item a:visited{
color: #475404;
text-decoration: none;
}
#nav .page_item a{
color: #475404;
text-decoration: none;
background: #e1b576 ;
padding: 5px 15px;
font: bold 14px/100% Arial, Helvetica, sans-serif;
border-top: 1px solid #043b4a;
border-left: 1px solid #043b4a;
border-right: 1px solid #043b4a;
display: block;
}
#nav .page_item a:hover {
color: #000000;
}
#navads
{
background: #043b4a ;
height: 15px;
}
#navbottom
{
background: #ffffff url(img/bottom-nav.gif) repeat-x;
height: 14px;
margin-bottom: 1.5em;
}
/* content */
#content {
padding: 0px 10px 25px 13px;
float: right;
width: 630px;
overflow: hidden;
}
.post {
clear:both;
padding-top: 15px;
}
.entry {
float:left;
width: 620px;
}
.post-cat {
padding-left: 5px;
float:left;
font-size: 95%;
color: #53544E;
}
.post-comments {
padding-left: 5px;
float: right;
font-size: 95%;
}
.post-calendar {
padding-left:5px;
float: right;
font-size: 95%;
color: #53544E;
}
.postmetadata {
color: #000000;
font-size:12px;
padding:8px;
background: #ffffff url(img/meta.jpg) repeat-x;
height:18px;
}
.postmetadatap {
color: #000000;
font-size:14px;
padding:8px;
background: #ffffff url(img/pback.jpg) repeat-x;
height:60px;
}
.postrss{
color: #000000;
font-size:13px;
padding: 3mm;
border: thin dotted #2c2c2c;
font: verdana;
}
.googleads{
width:615px;
float:left;
color:#666;
background:#fff;
margin:5px 0 5px 0px;
padding:10px 0 10px 20px;
border: 1px solid #eee;
}
.similiar{
width:595px;
float:left;
color:#000000;
text-align:justify;
margin:5px auto;
padding:5px 6px 10px;
}
.post-views {
padding-left:5px;
float: left;
font-size: 95%;
color: #53544E;
}
.post-content {
clear: both;
padding-top: 10px;
}
.navigation {
clear: both;
padding: 10px 0px;
}
.navigation a, .navigation a:visited {
color: #53544E;
}
.previous-entries a {
float: left;
padding-left: 5px;
}
.next-entries a {
float: right;
padding-right: 5px;
}
/* comments */
#comments, #respond {
border-bottom: 1px dotted #DFD266;
padding: 10px 0 5px 0;
clear: both;
}
.commentlist {
margin: 10px 0px;
padding-left: 20px;
line-height: 130%;
}
.commentlist li{
padding: 5px 10px;
}
.commentlist .alt {
background: #ffffff;
border: 1px dotted #EBEFE4;
}
.commentlist cite, .commentlist cite a, .commentlist cite a:visited {
font-weight: bold;
font-style: normal;
font-size: 120%;
color: #183000;
}
.commentlist small {
margin-bottom: 5px;
display: block;
font-size: 87%;
}
#commentform {
margin-top: 10px;
font: 110% Arial, Helvetica, sans-serif;
}
#commentform p {
padding: 6px 0px;
margin: 0px;
}
#commentform label{
color: #242121;
font-size: 87%;
}
#commentform input{
width: 200px;
background:#ffffff;
border: 1px solid #EBEFE4;
padding: 3px;
margin-top: 3px;
}
#commentform textarea{
width: 515px;
height: 115px;
background:#ffffff;
border: 1px solid #EBEFE4;
padding: 2px;
margin-top: 3px;
}
#commentform textarea:focus, #commentform input[type="text"]:focus {
background: #ffffff;
}
#commentform #submit{
background: #ffffff ;
font: bold 12px Arial, Helvetica, sans-serif;
color: #183000;
border:1px solid #053743;
float:left;
width: 144px;
height: 28px;
cursor: pointer;
}
/*sidebar */
#sidebar {
padding: 10px 0px 20px 13px;
float: left;
width: 200px;
color: #ffffff;
overflow: hidden;

}
/*sidebar title */
#sidebar h2 #sidebar .sidebartitle{
font-size:12px;
font-family:Verdana, Arial, Helvetica, sans-serif;
color: #4F9DB0;
margin: 20px 0px 2px;
border-bottom: 1px solid #CAC73C;
}
/*sidebar text styles */
#sidebar a, #sidebar a:visited{
color: #183000;
text-decoration: none;
}
#sidebar a:hover{
color: #183000;
text-decoration: none;

}
/*sidebar list level1 */
#sidebar ul {
margin: 0;
padding: 0;
}
#sidebar ul li {
list-style: none;
margin: 0;
padding: 0;
border: none;
}
/*sidebar list level2 */
#sidebar ul li ul {
padding: 0;
margin: 0;
}
#sidebar ul li ul li{
padding: 2px 0 2px 0px;
border-bottom: 1px solid #EBEFE4;
}
/*sidebar list level3 */
#sidebar ul li ul li ul li{
padding: 1px 0 1px 10px;
border: none;
}
/*blogroll */
ul.list-blogroll li{
padding-left: 5px !important;
}
/*meta */
ul.list-meta li{
padding-left: 5px !important;
}
/*rss */
ul.list-rss li{
padding-left: 5px !important;
}
/*category bar */
ul.list-cat li, li.bar_categories li{
padding-left: 5px !important;
}
/*recent bar */
ul.list-rec li, li.bar_comments ul li {
padding-left: 5px !important;
}
/*archives bar */
ul.list-archives li, li.bar_archives li{
padding-left: 5px !important;
}
/*pages bar */
ul.list-page li, li.bar_pages li, li.bar_recent_entries li{
padding-left: 5px !important;
}
/*sub-pages bar */
ul.list-page li ul li, li.bar_pages li ul li{
padding-left: 10px !important;
}
/*calendar bar */
li.bar_calendar td {
padding: 1px 7px;
}
/*text bar */
.textbar {
padding-top: 5px;
}
/*search form */
#searchform {
margin: 15px 0 0;
}
#searchform br {
display: none;
}
#searchform #s {
border:1px solid #183000;
width: 115px;
height: 22px;
padding: 4px 5px 0px 5px;
border: 1px solid #043b4a;
background: #ffffff;
margin-right: 2px;
color: #000000;
font-weight: normal;
}
/* search form button - to specify button only use input[type="submit"] */
#searchform input {
background:#ffffff ;
border: 1px solid #183000;
width: 65px;
height: 28px;
font: bold 12px Arial, Helvetica, sans-serif;
color: #183000;
vertical-align: middle;
}
/* page close */
#close {
clear: both;
background: #ffffff;
color: #ffffff;
font-size: 95%;
line-height: 130%;
padding-bottom: 10px;
}
/* footer bar */
#footer {
margin: 0px auto;
width: 900px;
color: #ffffff;
height: 30px;
font-size: 12px;
line-height: 100%;
background: #183000 ;

}
#footer a, #credit a:visited {
margin-top: 8px;
color: #ffffff;
}
/* alignments */
.center {
text-align: center;
}
img.center, img[align="center"] {
display: block;
margin-left: auto;
margin-right: auto;
}
.alignleft {
float: left;
}
img.alignleft, img[align="left"] {
float:left;
margin: 2px 10px 5px 0px;
}
.alignright {
float: right;
}
img.alignright, img[align="right"] {
float:right;
margin: 2px 0px 5px 10px;
}
.clear {
clear:both;
}
hr.clear {
clear:both;
visibility: hidden;
margin: 0px;
padding: 0px;
}
#header #position #wordpress
  • Profile picture of the author Ron Killian
    I am no CSS expert, far from it, but this might work:

    #header {
    background: #000000;
    height: 250px;
    margin: auto;
    }
    #headerlogo {
    margin: auto;
    padding: 20px 0px 0px 35px;
    height: 60px;
    }

    You could give that a try. Should set background to black and "auto" should center it. Unless some one with more CSS experience could correct me or come up with some better code?
    Signature
    PLR Affiliate Program Has Launched! Easily Promote Over 5,000 PLR and MRR Products.

    Largest Selection of PLR Articles on the Planet! PLR Ebooks, PLR Video, PLR Websites and more with Private Label Rights
    {{ DiscussionBoard.errors[647569].message }}

Trending Topics