Help in Pixelpost

[Louiethecuban]

I'm frustrated man.

 

Alright, so I'm the owner of a site called Happyfood, and have decided to update it from it's archaic pure html structure. I decided to use PixelPost (http://pixelpost.org).

 

They have a shitload of templates, and I've been really busy completely customizing AliPixel (http://www.pixelpost.org/extend/templates/alipixel/).

 

Here's my site for reference: http://wherefoodishappy.com/index.php

 

There are two things that I need help with. First off, I have written several comments, and they down show on the drop down menu. They DO show on the site (like where it says "Comments: 2). AliPixel's comments and javascript is based of http://treeswing.net/, as well as http://theworldin35mm.org/ if that helps at all.

 

The second problem I have is that I'm trying to center that header on the top, while keeping all of the buttons under it like that. If needed I can send you the .html file, or if really necessary, the entire customized theme as a .zip.

 

Please help me out!

[phpSensei]

1st problem I have no idea what you mean

 

2nd problem....

 

POST the CSS for the index page, its the site-title style thats need to be edited. you can move it by pixels.

[Louiethecuban]

_{^{1st problem I have no idea what you mean}}

 

_{^{2nd problem....}}

 

_{^{POST the CSS for the index page, its the site-title style thats need to be edited. you can move it by pixels.}}

_^/*

_{^{TEMPLATE NAME: alipixel}}

_{^{AUTHOR: Ali TowFigh}}

_{^{AUTHOR WEBSITE: http://alipixel.com}}

_{^{VERSION: 1.0}}

 

_^*/

_{^{html {min-height: 100.1%;}}}

_{^{body {}}

_{^{margin: 0px;}}

_{^{padding: 0px;}}

_{^{color: #DDD;}}

_{^{background-image:url(../images/bg2.jpg);}}

_{^{background-repeat:repeat-y;}}

_{^{background-position:center top;}}

_{^{font: normal 12px/16px 'Lucida Grande', Helvetica, Tahoma, sans-serif;}}

_{^{text-align: center;}}

_^}

 

_{^{a:hover { color: #F90; }}}

 

_{^{a:link, a:visited {}}

_{^{color: #888;}}

_{^{background-color: inherit;}}

_{^{text-decoration: none;}}

_^}

 

_{^{h6, p, ul, li {}}

_{^{margin: 0px;}}

_{^{padding: 0px;}}

_{^{font-weight: normal;}}

_^}

 

_{^{ul, li {list-style: none;}}}

 

_{^{h1 {}}

        _{^{color: #9CC;}}

_{^{font-size: 12px;}}

_{^{display: inline;}}

        _{^{text-transform: uppercase;}}

_^}

_{^{h2 {}}   

        _{^{font-weight: 400;}}

        _{^{margin: 0px;}}

        _{^{padding: 0px;}}

_{^{font-size: 16px;}}

_{^{color: #F90;}}

_{^{display: inline;}}

_^}

_{^{h3 { margin: 0px 0px 8px 0px;}}

        _{^{color: #F90;}}

_{^{font-size: 12px;}}

_{^{letter-spacing: 2px;}}

_{^{text-transform: uppercase;}}

_^}

_{^{h4 {}}

_{^{margin: 0px 5px 5px 0px;}}

        _{^{display: inline;}}

        _{^{color: #F90;}}

        _{^{font-size: 12px;}}

        _{^{letter-spacing: 4px;}}

_{^{text-transform: uppercase;}}

_^}

_{^{h5 {}}

        _{^{margin: 0px 0px 0px 0px;}}

      _{^{font-size: 12px;}}

_{^{color: #DDD;}}

_{^{letter-spacing: 1px;}}

_{^{font-size: 12px;}}

        _{^{display: inline;}}

_^}

_{^{h6 {}}

_{^{letter-spacing:2px;}}

_{^{font-size:14px;}}

_{^{font-weight:bold;}}

_{^{color: #e58c08;}}

_{^{text-transform: uppercase;}}

_^}

_{^{p {}}

_{^{margin: 0 0 4px 0px;}}

_{^{text-align: left;}}

_^}

_{^{img { border: none;}}}

_{^{fieldset {}}

_{^{color: #CCC;}}

_{^{background-color: inherit;}}

_{^{border: none;}}

_{^{font-size: 10px;}}

_^}

_{^{#menu ul a:hover, a:active, a:focus {color: #F90;}}}

_{^{.wrapper {}}

_{^{width: 800px;}}

_{^{margin: 0 auto;}}

_^}

_{^{.rsaquo { font-size: 12px; }}}

_{^{.clear { clear: both; }}}

_{^{.left { float: left; }}}

_{^{.right { float: right; }}}

 

_{^{/* HEADER */}}

_{^{#topborder {}}

_{^{width: 100%;}}

_{^{height: 0.3em;}}

_{^{color: inherit;}}

_{^{background-color: #800;}}

_^}

_{^{#header {}}

_{^{margin: 10px auto;}}

_{^{padding: 0px;}}

_{^{width: 800px;}}

_^}

_{^{#site-title {}}

_{^{float: left;}}

_{^{font: normal 30px Georgia, 'Gill Sans', Palatino, serif;}}

_{^{text-transform: lowercase;}}

_{^{text-align: left;}}

_{^{letter-spacing: -2px;}}

_{^{color: #999;}}

_{^{background-color: inherit;}}

_{^{padding: 1px;}}

_^}

_{^{#site-title a:link, #site-title a:visited {}}

_{^{color: #999;}}

_{^{background-color: inherit;}}

_^}

_{^{#site-title a:hover, #site-title a:focus {}}

_{^{color: #e58c08;}}

_{^{background-color: inherit;}}

_{^{text-decoration: none;}}

_^}

_{^{#sub-title {}}

_{^{float: right;}}

_{^{letter-spacing: 2px;}}

_{^{font-size: 10px;}}

_{^{margin: 3px 0px 0px 0px;}}

_{^{padding: 0px;}}

_{^{text-transform: none;}}

_^}

_{^{#menu {}}

_{^{width: auto;}}

_{^{margin: 0px;}}

_{^{padding: 0px;}}

_{^{float: center;}}

_{^{font-size: 10px;}}

_{^{letter-spacing: 1px;}}

_{^{text-align: center;}}

_{^{text-transform: uppercase;}}

_^}

_{^{#menu ul {}}

_{^{max-width:500px;}}

_{^{border-bottom: 0px dashed #888;}}

       

_^}

_{^{#menu li {display: inline;}}}

 

_{^{#menu a:link, #menu a:visited {}}

_{^{text-decoration: none;}}

_^}

 

_{^{/* FOOTER */}}

 

_{^{#footer {}}

_{^{border-top: 1px dashed #999;}}

_{^{margin: 5px auto 10px auto;}}

_{^{padding: 5px 0px;}}

_{^{width: 800px;}}

_{^{color: #000;}}

_{^{background-color: inherit;}}

_{^{font-size: 10px;}}

_{^{clear: both;}}

_^}

_{^{#footer a:link, #footer a:visited {}}

        _{^{display: inline;}}

        _{^{text-align: center;}}

        _{^{color: #222;}}

_{^{background-color: inherit;}}

_^}

_{^{#footer a:hover {}}

        _{^{display: inline;}}

        _{^{text-align: center;}}

_{^{color: #e58c08;}}

_{^{background-color: inherit;}}

_^}

 

_{^{.loadtime {}}

_{^{text-transform: uppercase;}}

_{^{font-size: 9px;}}

_^}

 

 

_{^{/* PAGE */}}

 

_{^{#page {}}

_{^{margin: 0px auto;}}

_^}

 

_{^{#page p, #page ul {}}

_{^{margin: 0px 25px 20px 0px;}}

_^}

 

 

_{^{/* IMAGE */}}

 

_{^{#image-container {}}

_{^{width: 800px;}}

_^}

 

_{^{#image-nav-links {}}

_{^{margin: 0px;}}

_{^{padding: 0px 0px 4px 0px;}}

_{^{width: 800px;}}

_{^{font-weight: normal;}}

_{^{letter-spacing: 2px;}}

_{^{font-size: 10px;}}

_{^{text-transform: uppercase;}}

_^}

 

_{^{#image-nav-prevlink {}}

_{^{float: left;}}

_^}

 

_{^{#image-nav-nextlink {}}

_{^{float: right;}}

_^}

 

_{^{#image-border {}}

_{^{border: 1px solid #000;}}

_{^{padding: 0px;}}

_{^{width: 800px;}}

_{^{position: relative;}}

_{^{margin: 0px auto;}}

_{^{background: transparent url(../images/indicator-big-loader.gif) no-repeat 50% 50%;}}

_^}

 

_{^{#image-info {}}

_{^{margin: 8px 5px 0px 5px;}}

_{^{padding: 5px 5px;}}

 

_{^{text-align: left;}}

_{^{text-transform: uppercase;}}

_{^{color: #888;}}

_{^{background-color: FFF;}}

_^}

 

_{^{#image-nav-overlay {}}

_{^{position: absolute;}}

_{^{margin: 0px;}}

_{^{padding: 0px;}}

_{^{top: 0px;}}

_{^{left: 0px;}}

_{^{z-index: 99;}}

_^}

 

_{^{#image-nav-overlay a {}}

_{^{outline: none;}}

_{^{line-height: 0px;}}

_^}

 

_{^{#image-nav-prevoverlay, #image-nav-nextoverlay {}}

_{^{width: 49.9%;}}

_{^{height: 100%;}}

_{^{/* Trick IE into showing hover */}}

_{^{background: transparent url(../images/blank.gif) no-repeat;}}

_^}

 

_{^{#image-nav-prevoverlay {}}

_{^{top: 0px;}}

_{^{left: 0px;}}

_{^{float: left;}}

_^}

 

_{^{#image-nav-nextoverlay {}}

_{^{top: 0px;}}

_{^{right: 0px;}}

_{^{float: right;}}

_^}

 

_{^{#image-nav-prevoverlay:hover,}}

_{^{#image-nav-prevoverlay:visited:hover,}}

_{^{#image-nav-prevoverlay:focus {}}

_{^{background: url(../images/p_prev.png) center left no-repeat;}}

_{^{cursor: pointer;}}

_^}

 

_{^{#image-nav-nextoverlay:hover,}}

_{^{#image-nav-nextoverlay:visited:hover,}}

_{^{#image-nav-nextoverlay:focus {}}

_{^{background: url(../images/p_next.png) center right no-repeat;}}

_{^{cursor: pointer;}}

_^}

 

_{^{.image-title {}}

        _{^{margin-left: 5px;}}

_{^{font-size: 12px;}}

_{^{color: #000;}}

_{^{background-color: inherit;}}

_{^{float: left;}}

_^}

 

_{^{.image-date {}}

        _{^{margin-right: 5px;}}

_{^{font-size: 10px;}}

_{^{text-align: right;}}

_{^{float: right;}}

        _{^{color: #000;}}

_^}

 

_{^{.image-comment {}}

        _{^{margin-right: 1px;}}

_{^{font-size: 10px;}}

_{^{text-align: right;}}

_{^{float: right;}}

        _{^{color: #000;}}

_^}

_{^{.image-comment a:hover {}}

        _{^{color: #e58c08;}}

_^}

 

_{^{.image-rate {}}

        _{^{margin-left: -3px;}}

_{^{text-align: left;}}

        _{^{float: left;}}

_^}

 

_{^{/* COMMENTS */}}

 

_{^{#comments-container {}}

_{^{color: #E9E9E9;}}

_{^{background-color: #a64f20;}}

_{^{width: 770px;}}

_{^{text-align: left;}}

_{^{padding: 15px;}}

_{^{margin-top: 0px;}}

_{^{filter:alpha(opacity=100);}}

_{^{-moz-opacity:1;}}

_^opacity:1;

_{^{border: 1px double #000;}}

 

_^}

 

_{^{#comments-container h3 {}}

_{^{padding-bottom: 3px;}}

_^}

 

_{^{/* COMMENTS - IMAGE NOTES */}}

 

_{^{#image-notes {}}

_{^{float: left;}}

_{^{width: 39%;}}

_{^{margin-bottom: 0px;}}

_^}

 

_{^{#image-notes li {}}

_{^{margin: 0px 0px 0px 5px;}}

_^}

 

 

_{^{#info {}}

_{^{margin: 0px 0px 0px 0px;}}

        _{^{border-bottom: 1px dotted #999;}}

_^}

 

_{^{#info li {}}

_{^{padding: 5px 0px 0px 5px;}}

        _{^{color: #EEE;}}

_^}

 

_{^{#info ul {}}

_{^{margin-bottom: 5px;}}

_^}

 

_{^{#info li a:hover {}}

_{^{color: #e58c08;}}

_^}

 

_{^{#info li a {}}

_{^{color: #ACACAC;}}

_^}

 

_{^{#rgbhistograme {}}

_{^{margin: 10px 0px 0px 0px;}}

        _{^{border-bottom: 1px dotted #999;}}

_^}

 

_{^{#rgbhistograme ul {}}

_{^{margin-bottom: 5px;}}

_^}

 

_{^{#rgbhistograme li {}}

_{^{padding: 5px 0px 0px 8px;}}

_^}

 

_{^{#exif {}}

_{^{margin: 10px 0px 0px 0px;}}

        _{^{border-bottom: 1px dotted #999;}}

_^}

 

_{^{#exif ul {}}

_{^{margin-bottom: 5px;}}

_^}

 

_{^{#exif li {}}

_{^{padding: 5px 0px 0px 5px;}}

_^}

 

_{^{#googlemaplink {}}

_{^{margin: 0px 0px 0px 0px;}}

        _{^{border-bottom: 1px dotted #999;}}

_^}

 

_{^{#googlemaplink ul {}}

_{^{margin-bottom: 5px;}}

_^}

 

_{^{#googlemaplink li {}}

_{^{padding: 5px 0px 0px 5px;}}

_^}

 

_{^{#googlemaplink li a:hover {}}

_{^{color: #e58c08;}}

_^}

 

_{^{#googlemaplink li a {}}

        _{^{color: #979797;}}

_^}

 

_{^{#votecool {}}

        _{^{margin: 10px 0px 0px 0px;}}

_{^{font-weight: normal;}}

_^}

_{^{.votecool {}}

_{^{font-size: 10px;}}

        _{^{color: #9CC;}}

_^}

 

_{^{#votecool ul {}}

_{^{margin-bottom: 5px;}}

_^}

 

_{^{#votecool li {}}

        _{^{padding: 5px 5px 0px 0px;}}

_^}

 

 

_{^{/* USER COMMENTS */}}

 

_{^{#image-comments {}}

_{^{float: right;}}

_{^{width: 58%;}}

_{^{margin: 0px 0px 0px 0px;}}

_{^{padding: 0px 0px 0px 10px;}}

_{^{border-left: 0px solid #999;}}

_^}

 

_{^{#comments li {}}

_{^{margin: 10px 0px 15px 0px;}}

        _{^{padding: 0px 0px 0px 10px;}}

_^}

 

_{^{#comments li a:hover {}}

_{^{color: #fff;}}

_^}

 

_{^{/* COMMENT FORM */}}

 

_{^{#addcomment {}}

_{^{padding: 15px 0px;}}

_{^{border-top: 1px solid #999;}}

_{^{border-bottom: 0px solid #999;}}

_{^{text-align: left;}}

_^}

 

_{^{.input {}}

_{^{width: 45%;}}

_{^{border: 1px solid #9CC;}}

_{^{color: #000;}}

_{^{background-color: #f4c87f;}}

_{^{padding: 4px;}}

_{^{margin: 0px 0px 8px 0px;}}

_^}

 

_{^{#addcomment textarea {}}

_{^{width: 95%;}}

_{^{height: 150px;}}

_{^{border: 1px solid #9CC;}}

_{^{color: #F2F2F2;}}

_{^{background-color: #666;}}

_{^{padding: 4px;}}

_{^{margin: 0px 0px 8px 0px;}}

_^}

 

_{^{.comment-button {}}

_{^{border: 3px double #000;}}

_{^{font-size: 10px;}}

_{^{color: #F2F2F2;}}

_{^{background-color: #666;}}

_{^{text-transform: uppercase;}}

_{^{padding: 3px;}}

_{^{margin: 8px 0px 0px 0px;}}

_^}

 

_{^{/* COMMENT THANKS */}}

 

_{^{#thanks {}}

_{^{text-align: center;}}

_^}

 

_{^{#thanks p {}}

_{^{font-weight: bold;}}

_{^{font-size: 10px;}}

_{^{padding: 4px 0px;}}

_{^{margin: 0px;}}

_^}

 

_{^{#thanks a:hover {}}

_{^{color: #F90;}}

_^}

_{^{#thanks a {}}

_{^{font-weight: bold;}}

_{^{font-size: 10px;}}

_{^{padding: 0px;}}

_{^{margin: 0px;}}

_^}

 

_{^{#thanks li {}}

        _{^{float: right;}}

_{^{display: inline;}}

_{^{padding: 0px 0px 0px 0px;}}

_^}

 

_{^{#thanks li.last {}}

_{^{padding: 0px;}}

_^}

 

 

_{^{/* google */}}

 

_{^{#google-container {}}

_{^{padding-top: 20px;}}

_{^{text-align: center;}}

_^}

 

_{^{#google-container ul {}}

_{^{padding-top: 10px;}}

_^}

 

_{^{#google-container li {}}

_{^{margin-left: 20px;}}

_^}

 

 

_{^{/* ABOUT */}}

 

_{^{#about-container {}}

_{^{padding-top: 20px;}}

_^}

 

_{^{#photo-self {}}

_{^{border: 1px solid #000;}}

_{^{margin: 0px;}}

_{^{padding: 2px;}}

_^}

 

_{^{#about-container #photo-self {}}

_{^{padding: 4px;}}

_{^{margin: 2px 18px;}}

_^}

 

_{^{/* COLUMNS */}}

 

_{^{#column1, #column2, #column3 {}}

_{^{width: 220px;}}

_{^{text-align: left;}}

_{^{float: left;}}

_^}

 

_{^{#column1 {}}

_{^{margin-left: 80px;}}

_^}

 

_{^{#column2 {}}

_{^{margin-left: 50px;}}

_^}

 

_{^{#column1 a:hover {color: #F90;}}}

 

_{^{#column2 a:hover {color: #F90;}}}

 

_{^{#column3 a:hover {color: #F90;}}}

 

_{^{#column3 {margin-left: 10px;}}}

 

_{^{.column4 {}}

        _{^{width: 800px;}}

_{^{font-size: 10px;}}

_{^{text-align: center;}}

_{^{color: #FFF;}}

_^}

 

_{^{.column4 a, a:link, a:visited {color: #888;}}}

 

_{^{.column4 a:hover {color: #F90;}}}

 

_{^{.column4 h1 {color: #F90;}}}

 

_{^{#photo-self {}}

_{^{background-color: #F9F9F9;}}

_{^{border: 1px solid #E0E0E0;}}

_{^{margin: 5px 0px;}}

_{^{padding: 6px;}}

_^}

 

_{^{/* BROWSE */}}

 

_{^{#browse-container {}}

_{^{float: left;}}

_{^{width: 750px;}}

_{^{padding: 20px 0;}}

_{^{margin: 0px;}}

_{^{text-align: left;}}

_^}

 

_{^{#category-container { /* WIDTH = 210px */}}

_{^{float: left;}}

_{^{text-align: left;}}

_{^{padding: 0px 5px;}}

_^}

_{^{#category-container  a:hover { color: #000; }}}

 

_{^{#category-container ul {}}

_{^{margin: 0px;}}

_{^{padding: 0px 2px 15px 2px;}}

_^}

 

_{^{#category-container li {}}

_{^{padding: 2px 0px;}}

_{^{border-bottom: 1px dotted #999;}}

_^}

 

_{^{#thumbnail-container {}}

_{^{float: right;}}

_{^{width: 510px;}}

_^}

 

_{^{a img.thumbnails {opacity: 0.69;}}}

 

_{^{a:hover img.thumbnails, a:focus img.thumbnails {opacity: 1.0;}}}

[phpSensei]

<meta name="description" content="><meta name="description" content="A daily photoblog of Ali TowFigh" />

 

 

fix that.. content = "

 

 

edit: wow... i dont even know how you got this site.. its so messy.

[Louiethecuban]

what?

[phpSensei]

what?

 

Your DIV/CSS is all wrong. The float is wrong, everything is messy and the coding is bad. I suggest you learn the basics first then rewrite this html..

 

 

float is a critical part of CSS/DIV layouts, read about it. google it.

[Louiethecuban]

What? Could you be more specific than just telling me that "everything is wrong and messy".

[phpSensei]

<div id="topborder"></div>
<div id="header">
<div id="site-title">
	<div align="right"><a href="http://wherefoodishappy.com/"><img src="http://wherefoodishappy.com/templates/alipixel/images/logo.png" width="530" height="80" alt="alipixel.com" /> </a> </div>
</div>
    

 

div align="right"..... you dont use ALIGN

 

Must be liek this

#site-title{
position:absolute;
width:200px;
height:115px;
z-index:1;
left: 131px;
top: 148px;
}

 

<div id="site-title">yoiurimagehere</div>

 

and to center it you play around with the LEFT AND TOP, X AND Y