So I've tried for days to get just a plain white background to show up behind my Picasa web gallery on my CMSMS blog. It displays correctly in IE6/7 but does NOT in Firefox (for once). You can see it here: http://www.monzyk.com/index.php?page=photos
I've assigned a background color in divs, forced heights, the whole thing but CANNOT for the LIFE OF ME figure this out.
Anyone?
Background in Picasa Web Gallery?
Re: Background in Picasa Web Gallery?
I've looked at your photo's using FF, and I have a white background. Or do you mean the background when show the flash lay out?
Re: Background in Picasa Web Gallery?
Sorry, I should've been more clear. On he main page "album view" where all of the albums are listed, the background of the albums are white, but you'll notice the white background of the page doesn't extend the entire width of the template. Once you get INSIDE of the album, or look at individual pictures it seems to be fine. Did you not notice this in FF when you hit the page?
-
calguy1000
- Support Guru
- Posts: 8169
- Joined: Tue Oct 19, 2004 6:44 pm
Re: Background in Picasa Web Gallery?
Everybody (I'm posting this because alot of people will read this post, not just the poster)
Please take the time to be clear and precise, and provide accurate information (versions of php, mysql, cms core, and the relevant modules at least) when posting questions, or reporting problems. If you don't post sufficient accurate information, you're just wasting everybody's time (yours and anybody that may potentially respond).
This happens too often, and must be minimized.
future posts that don't provide sufficient information may be deleted.
Please take the time to be clear and precise, and provide accurate information (versions of php, mysql, cms core, and the relevant modules at least) when posting questions, or reporting problems. If you don't post sufficient accurate information, you're just wasting everybody's time (yours and anybody that may potentially respond).
This happens too often, and must be minimized.
future posts that don't provide sufficient information may be deleted.
Follow me on twitter
Please post system information from "Extensions >> System Information" (there is a bbcode option) on all posts asking for assistance.
--------------------
If you can't bother explaining your problem well, you shouldn't expect much in the way of assistance.
Please post system information from "Extensions >> System Information" (there is a bbcode option) on all posts asking for assistance.
--------------------
If you can't bother explaining your problem well, you shouldn't expect much in the way of assistance.
Re: Background in Picasa Web Gallery?
I'm Sorry Calguy, you are right. Bad forum etiquitte. Here are the hard facts:
Platform:
MySQL = 5.0.22
PHP = 5.1.2
CMSMS = 1.2.2 "Holetown"
Module = Picasa Web Gallery
This is the smarty tag on the page as input to the content editor:
Here is my Album Template:
Here are the CSS classes relevant to the web album:
And here is the full template and CSS for reference:
Template:
CSS:
Platform:
MySQL = 5.0.22
PHP = 5.1.2
CMSMS = 1.2.2 "Holetown"
Module = Picasa Web Gallery
This is the smarty tag on the page as input to the content editor:
Code: Select all
{cms_module module='PicasaWebAlbumBrowser' user='username'}Here is my Album Template:
Code: Select all
{section name=thumbnails loop=$thumbnails}
<div id='photos'>
<div class='pwaAlbum' style='width:180px;height:220px;float:left;text-align:center;'>
<a title="{$titles[titles]}" href="{$links[thumbnails]}" class='imageBorder'>
<img src='{$thumbnails[thumbnails]}' style='padding:0px;' />
<div class='photoCaption'>
{$titles[thumbnails]}
</div>
</a>
</div>
</div>
{/section}
Here are the CSS classes relevant to the web album:
Code: Select all
#mainContent { !!!!!NOTE: this is where the {content} tag is placed, which is where the page content (the Picasa tag) would appear
padding: 15px 20px 20px 20px;
background: #FFF;
}
#photos {
background: #FFF;
width:760;
display:block;
}
.pwaAlbum {
background: #FFF;
padding-top:0px;
padding-left:0px;
}
.imageBorder {
display: block;
position: relative;
background-color: #efefef;
border: 1px solid #a9a9a9;
margin: 0px 0px 0px 0px;
padding: 3px 3px 3px 3px;
width: 160px;
height: 185px;
}
.imageBorderSmall {
display: block;
position: relative;
background-color: #efefef;
border: 1px solid #a9a9a9;
margin: 0px 0px 0px 0px;
padding: 3px 3px 3px 3px;
}
.photoCaption {
font-family: Tahoma, Verdana, Geneva, Arial, sans-serif;
font-size:11px;
clear:both;
float:left;
width:100%;
height:20px;
text-align:right;
font-weight:normal;
margin: 0px;
}
And here is the full template and CSS for reference:
Template:
Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<__html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
<head>
<title>{sitename} - {title}</title>
{metadata}
{stylesheet}
</head>
</__body class="bodyStyle">
<div id="container">
<div class="content">
<div id="header">
</div>
<div class="bumpMenu">
<div id="menu">
{menu template="Glossy_Menu_Horiz"}
</div>
</div>
<div class="bumpRight">
<div id="mainContent">
{content}
</div>
</div>
</div>
</div>
<__body>
</__html>CSS:
Code: Select all
#photos {
background: #FFF;
width:760;
display:block;
}
.pwaAlbum {
background: #FFF;
padding-top:0px;
padding-left:0px;
}
.imageBorder {
display: block;
position: relative;
background-color: #efefef;
border: 1px solid #a9a9a9;
margin: 0px 0px 0px 0px;
padding: 3px 3px 3px 3px;
width: 160px;
height: 185px;
}
.imageBorderSmall {
display: block;
position: relative;
background-color: #efefef;
border: 1px solid #a9a9a9;
margin: 0px 0px 0px 0px;
padding: 3px 3px 3px 3px;
}
.photoCaption {
font-family: Tahoma, Verdana, Geneva, Arial, sans-serif;
font-size:11px;
clear:both;
float:left;
width:100%;
height:20px;
text-align:right;
font-weight:normal;
margin: 0px;
}
a img{ border:none; }
body {
margin:0px 0;
padding:0;
background: #FFF;
}
.bodyStyle {
margin:0px 0;
padding:0;
font-family: "Trebuchet MS", Verdana, Geneva, Arial, sans-serif;
font-size : 12px;
color: #333;
background: #343434 url(images/monzyk/bg.jpg) repeat-x;
line-height: 1.4em;
}
p { font-family: Trebuchet MS, Arial, Helvetica, sans serif; margin: 0 0 5px 0; padding: 0; color: #555; background: inherit; }
a { color: #a90000; background: inherit; text-decoration:none; }
a:hover { color:#FC7901; background: inherit; text-decoration:none; }
ul {
margin-left: 5px;
padding: 0px;
}
li {
margin-left: 10px;
margin-top: 4px;
margin-bottom: 4px;
padding: 0px;
list-style-position: outside;
list-style-type: disc;
}
.content {
background: #FFF url(images/monzyk/bgmain.jpg) repeat-y center;
margin: 0 auto;
padding: 0;
width: 787px;
}
#mainContent {
padding: 15px 20px 20px 20px;
background: #FFF;
}
.bumpRight {
padding:10px;
}
.bumpMenu {
height:30px;
padding-left:8px;
padding-right:9px;
}
/* HEADER
---------------------------------------------------------------------------------------------------------------------------------------------------
*/
#header {
margin: 0;
width: 787px;
background: #FF9503 url(images/monzyk/header.jpg) no-repeat center top;
height: 166px;
color: #FFF;
}
/* FOOTER
---------------------------------------------------------------------------------------------------------------------------------------------------*/
#footer {
clear:both;
height: 34px;
color:#555;
width: 787px;
background: #fff url(images/monzyk/footer.jpg) top no-repeat;
font-size:90%;
padding: 0;
text-align:center;
}
#footer .padding { padding: 10px 0px 0px 0px; }
#footer .right {
float:right;
clear:right;
text-align:right;
}
/* ---------------------------------------------------------------------------------------------------------------------------------------------------*/
