PDA

Click to See Complete Forum and Search --> : Pixelpost



WannaBe_80z
09-05-2005, 04:02 PM
Alright so I am finally setting up my photoblog and only have a few things up. In firefox the site is right aligned but in IE it is centered? I WANT it centered. How do i fix this?

http://s92349618.onlinehome.us/pixelpost_1.4.2/index.php

WannaBe_80z
09-05-2005, 04:03 PM
I also want to have a "archive" button next to the current and previous and links and have it display thumbnails and stuff...where do I change all this?

aversion
09-05-2005, 06:37 PM
Where it says in the CSS

body {
background: #000000;
color: #444444;
font-family: Verdana, Helvetica, sans-serif;
font-size: 10px;
margin: 10px;
padding: 0px;
text-align: center;
}

Change margin:10px to margin:10px auto

IE understands the wrong way to do it, text-align shouldn't be used on structural elements.

No idea about adding an archive to pixelpost, I think they have their own help forums though.

WannaBe_80z
09-05-2005, 10:21 PM
Yeah their help forums are very poor :)

But thanks for the code.

ctranter
09-06-2005, 03:57 AM
Which template are you using? you should just need to point to:
http://s92349618.onlinehome.us/pixelpost_1.4.2/index.php?x=browse
but it doesnt seem to work. Do you have a browse template page?

WannaBe_80z
09-06-2005, 09:00 AM
I don't think so.

I am getting a new template today to test out. Hopefully thatwill have one.

ctranter
09-06-2005, 11:53 AM
works now i see :)

WannaBe_80z
09-06-2005, 01:17 PM
all the colors in the style file are only 3 characters?

WannaBe_80z
09-06-2005, 01:31 PM
Aversion I added that and it didn't change anything...

Here is the code for th styles:


/* .............................. */
/* Basic */
/* .............................. */

body {
text-align: left;
font-family: Verdana,Arial,sans-serif;
background:#fff;
margin:10 auto;
color:#666;
padding:0;
padding-top:30px;
}

html, body {
min-height:100.1%;
}

/* .............................. */
/* Link stylings */
/* .............................. */

a {
font-style: italic;
color: #666;
text-decoration: none;
}
a:hover {
text-decoration: underline;
color: #333;
}

/* .............................. */
/* Headings */
/* .............................. */

h1 {
font-family: Verdana,Arial,sans-serif;
font-size:large;
font-weight:bold;
color: #666;
border-bottom:1px solid #999;
margin-top:20px;
margin-right:15px;
position: normal;
margin-left:10px;
}

h2 {
text-align:left;
font-family:Verdana, Georgia, Arial, sans-serif;
font-size:large;
color: #666;
border-bottom:1px dotted #ccc;
margin-top:10px;
position: relative;
}
h3 {
font-family: Verdana,Arial,sans-serif;
font-size:medium;
font-weight:bold;
color: #666;
margin-top:10px;
position: relative;
}

/* .............................. */
/* Navigation */
/* .............................. */

#navigation {
font-family:Trebuchet ms, Tahoma, Verdana, Georgia, Arial, sans-serif;
color:#666;
font-size:11px;
width: 630px;
margin:0px auto;
background-color: #fff;
border-bottom:none;
border-right:1px solid #ccc;
border-left:1px solid #ccc;
border-top: 1px solid #ccc;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
padding-bottom:10px;
}
.navigation a{
color:#555;
font-weight:normal;
text-decoration:none;
border:0px;
font-style:normal;
}
.navigation a:active,
.navigation a:hover {
text-decoration:underline;
}
.navigationleft {
color:#555;
float:left;
position:relative;
padding:4px 4px 4px 8px;
text-align:left;
}
.navigationleft a {
color:#333;
}
.navigationright {
font-weight:bold;
color:#666;
letter-spacing:5px;
padding:4px 8px 4px 4px;
text-align:right;
}
.navigationright a {
font-weight:bold;
color:#ccc;
letter-spacing:5px;
padding:4px 8px 4px 4px;
text-align:right;
}
.navigationright a:hover {
text-decoration:none;
color:#333;
}
.navigationpost {
float: right;
text-align: right;
color:#aaa;
padding-bottom:2px;
padding-right:3px;
padding-left:3px;
border-bottom:1px solid #eee;
line-height:16px;
font-size: 9px;
margin:0;
letter-spacing: 1px;
}
.navigationpost a {
color: #666;
font-style:normal;
}
.navigationpost a:hover {
color: #333;
text-decoration:underline;
}
.addcommenttab {
float: left;
text-align: left;
padding-bottom:2px;
padding-right:3px;
padding-left:3px;
border-bottom:1px solid #eee;
line-height:16px;
font-size: 9px;
margin:0;
letter-spacing: 1px;
}
.addcommenttab a {
color: #666;
font-style:normal;
text-decoration:none;
}
.permalink {
font-size:9px;
text-decoration:none;
font-style:normal;
}
.date {
font-size:10px;
font-weight:normal;
letter-spacing:1px;
}

/* .............................. */
/* Menu */
/* .............................. */

#menu {
width: 630px;
font-size: 11px;
margin: 0 auto;
padding: 0;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
}
#menu ul {
margin:0;
padding: 0;
list-style-type: none;
}
#menu li {
background: #fff;
margin:0;
line-height: 1.5em;
width: 20%;
text-align: center;
padding:0;
float: left;
border-bottom:1px solid #ddd;
border-top:1px solid #ddd;
}
#menu a {
display: block;
width: 100%;
color:#666;
padding:0;
margin:0;
text-decoration: none;
font-style: normal;
}
#menu a:hover {
color:#000;
}

/* .............................. */
/* Content */
/* .............................. */

#photo {
text-align:center;
width:630px;
background-color: #fff;
border: 1px solid #ccc;
border-bottom:none;
margin:0 auto;
font-size: 12px;
padding:0;
}
#image {
padding:10px;
background:#fff;
border:none;
}
#page {
font-size: 12px;
width:600px;
background-color: #fff;
border: 1px solid #ccc;
border-bottom:none;
margin:0 auto;
padding:15px;
}
#browse {
font-size: 12px;
width:600px;
background-color: #fff;
border: 1px solid #ccc;
border-bottom:none;
margin:0 auto;
padding:15px;
}

/* .............................. */
/* Thumbnails */
/* .............................. */

#thumbrow {
text-align:center;
width:630px;
margin:0 auto;
background:#fff;
border-right:1px solid #ccc;
border-left:1px solid #ccc;
border-top:none;
}
#thumbrow .current_thumbnail {
filter: alpha(opacity=99);
opacity: 0.99;
padding:5px;
margin:3px;
border:1px solid #ccc;
}
#thumbrow a img {
filter: alpha(opacity=70);
opacity: 0.70;
margin:3px;
padding:5px;
border:1px solid #fff;
}
#thumbrow a:hover img, #thumbs a:focus img {
filter: alpha(opacity=99);
opacity: 0.99;
padding:5px;
border:1px solid #ddd;
}
#browse .thumbnails {
filter: alpha(opacity=70);
opacity: 0.70;
margin:3px;
padding:5px;
border:1px solid #fff;
}
#browse a:hover img{
filter: alpha(opacity=99);
opacity: 0.99;
padding:5px;
border:1px solid #ddd;
}
.thumb {
float:right;
border:1px solid #ccc;
padding:0;
margin-left:20px;
margin-right:0px;
margin-bottom:5px;
margin-top:15px;
}

/* .............................. */
/* Footer */
/* .............................. */

#footer {
text-align:center;
font-size: 9px;
color: #bbb;
line-height: 2em;
width:630px;
background-color: #fff;
border: 1px solid #ccc;
border-top:none;
margin:0 auto;
margin-bottom:20px;
padding:0px;
padding-top:5px;
padding-bottom:5px;
clear: both;
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-bottomright: 10px;
}
#footer a {
color: #bbb;
text-decoration:none;
font-style: normal;
}
#footer a:hover {
text-decoration:underline;
color:#333;
font-style: normal;
}


/* .............................. */
/* Comments */
/* .............................. */


#commentnavigation {
font-family:Trebuchet ms, Tahoma, Verdana, Georgia, Arial, sans-serif;
color:#aaa;
font-size:11px;
width: 100%;
margin:0 auto;
background-color: #fff;
border-bottom:1px solid #ccc;
}
#imageinfo {
font-size:12px;
height:auto;
width:420px;
padding:10px;
border-bottom: 1px solid #999;
margin-top: 25px;
margin-left: 15px;
margin-right: 10px;
}
#comments {
border:0px solid #444;
font-size: 10px;
margin: 0 auto;
margin-left:20px;
width:410px;
}
#comments ul {
padding:0px;
display:block;
margin:0;
margin-top:10px;
list-style:none;
}
#comments li {
width:100%;
padding-bottom:10px;
padding-top:10px;
padding-left:5px;
padding-right:5px;
margin:0;
border-top:0px;
border-left:0px;
border-right:0px;
border-bottom:1px dotted #444;
background:#fff;
}
#comments li:hover {
background:#eee;
}
#comments li a {
text-decoration:none;
color:#444;
}

#addcomment {
margin-left: 15px;
margin-right: 15px;
border:1px solid #aaa;
font-size: 12px;
background:#fff;
padding:10px;
margin-top:20px;
margin-bottom:20px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-bottomleft: 10px;
-moz-border-radius-bottomright: 10px;
}

.input {
width:40%;
font-size:10px;
padding:3px;
border:1px solid #aaa;
background: #eee;
color:#666;
}
.text {
width:95%;
font-size:11px;
padding:3px;
border:1px solid #aaa;
background: #eee;
color:#666;
}
.commentbutton {
background:#eee;
border:1px solid #aaa;
color:#666;
border-bottom:2px solid #aaa;
border-right:2px solid #aaa;
}

ctranter
09-06-2005, 01:31 PM
they will be abbreviated.

e.g.

#444 is same as #444444
#fff is same as #ffffff

WannaBe_80z
09-06-2005, 01:33 PM
I figured that is how it worked, Thanks.

Any idea on the aligning?

ctranter
09-06-2005, 01:33 PM
body {
text-align: left;
font-family: Verdana,Arial,sans-serif;
background:#fff;
margin:10 auto;
color:#666;
padding:0;
padding-top:30px;
}

html, body {
min-height:100.1%;
}

/*


maybe should be center?

ctranter
09-06-2005, 01:35 PM
Also what part of your site isnt centering? The new template you have all seems to be centerd to me. In ff and ie.

WannaBe_80z
09-06-2005, 01:40 PM
really? weird. what is wrong with my FF....it works in IE

and in my FF i can't use any of the button functions in advanced reply mode. I click on like say insert image and it just scrolls me to the top of the page...

WannaBe_80z
09-06-2005, 01:44 PM
everything is centered but when you actually look at thr large photos it is screwed up.

http://static.flickr.com/33/40872599_bf40c68575_o.jpg

ctranter
09-06-2005, 01:49 PM
ah right I got you now, i was just looking to see if it worked in ie.

Don't rob and Nords use this template? If so have you checked whether theirs does this?

ctranter
09-06-2005, 02:09 PM
Alternatively you could get in touch with Jspurling who I think made the template. Hes a nice guy whom im sure could help you out if all else fails.

EVPohovich
09-06-2005, 02:20 PM
First off all of the widths are set to 630px and your Images are larger than that. As you have a line down the left side of the page and margins set to place that line EVERYTHING will reference from there. If your photo is smaller than 630px it will centered, but if it is larger it will rest on the margin (+line and border.....whatever) and will continue on out toward the right.

You should set a size for your photos and stick with it. then build your site around your photosize.

Good luck!

aversion
09-06-2005, 03:21 PM
Aversion I added that and it didn't change anything...
As mentioned above, it's centering (that 10 needs px added after it btw) but your images are wider than your content area, which is set to 630 pixels. I've never dealt with a template but I would have thought that it would come with a recommendation for image sizes that would fit within it, including any padding and borders. At 630 pixels wide your images might still 'break' the layout.

You can make the layout wider by changing those widths if you want bigger pictures. On my site the content area is 720 wide with padding and borders and the widest images I can post before it does the same as yours is doing now is 690.

admedia
09-06-2005, 04:41 PM
You have a mac Wannabe?
I always thought you were a PC dude

EVPohovich
09-06-2005, 04:52 PM
it's just a Windows Theme.....

admedia
09-06-2005, 05:16 PM
What's it called? Wannabe Mac?

WannaBe_80z
09-06-2005, 05:39 PM
What's it called? Wannabe Mac?


OH! funny...actually I am not trying to be a mac, I just like the buttons and top bar. That apple instead of start really annoys me.

I will go through and reset all the widths and such. I have my images all at 800x600

Thanks for all the help

WannaBe_80z
09-06-2005, 05:47 PM
Thanks a lot for all your help. I have it all worked out now :)


Now let the realy tweaking begin.

robbmcaulay
09-06-2005, 06:40 PM
Yeh, let it begin... :mrt:

Only joking.

EVPohovich
09-06-2005, 06:55 PM
hey robb, ct and av.....we help the kid out and we don't even get on his links list.....sheez, what's up with that?

ctranter
09-06-2005, 07:19 PM
I'm on it :p

WannaBe_80z
09-06-2005, 11:13 PM
hey robb, ct and av.....we help the kid out and we don't even get on his links list.....sheez, what's up with that?


Don't worry, once I have time when I am not in class or working. And get the layout all tweaked and start to add the real guts to it. You'll all be linked.

adamcrohill
09-08-2005, 10:44 AM
where can i get that 'mac-a-like' windows theme? looks cool for playing tricks

WannaBe_80z
09-08-2005, 10:58 AM
StyleXp

it is one of the included themes, can use color or grey buttons