close ad
 
Important WebAssist Announcement
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

rating

Where in CSS can you edit Gallery borders

Thread began 1/20/2011 11:36 am by lecgraphx381289 | Last modified 1/24/2011 6:39 am by Jason Byrnes | 3417 views | 7 replies |

lecgraphx381289

Where in CSS can you edit Gallery borders

I am using Grid + Lightbox Gallery and have edited a number of style/color things via the various CSS stylesheets (light.css and common.css) I would like to remove/change the black border (Top & left) and the gray border (bottom & right). These are the borders surrounding the entire grid. Can anyone tell me where that style is set?
Thank You!

Sign in to reply to this post

Jason ByrnesWebAssist

the gallery doesn't have a border applied, it is the background color applied to the
.pg-gl element in the common.css that looks like a border.

Sign in to reply to this post

lecgraphx381289

What do I have to edit in this code to make those "borders" disappear? I tried changing the background color to white (#ffffff) but nothing changed. Here's the code unchanged:

/* body background
--------------------------------------------------*/

body.pg {
background-color: #212121;
}

/* wrapper
--------------------------------------------------*/

.pg-gl {
width: 720px;
font-family: Verdana, Arial, Helvetica, sans-serif;
background-color: #1e1e1e;
padding: 8px 0 8px 8px;
}

Sign in to reply to this post

Jason ByrnesWebAssist

it should just need changing of the background color.
Can you send a link where i can see the problem to investigate.

Sign in to reply to this post

lecgraphx381289

Here is a sample page. all that black/gray 2 pt (?) border around the grid I'd like to eliminate.

Also..is it possible to remove the pop-up box that comes up on hover. We have no need to add a description there.
THANK YOU!

gallery_portraits.html

Sign in to reply to this post

Jason ByrnesWebAssist

the border is occurring because you have the gallery in an iframe. add style="border:none;" as an inline style t the iframe tag.


<iframe style="border:none;" width="930" height="600" border="0" src="http://meaghanhull.com.previewdns.com/power_gallery/galleries/grid_lightbox/index.php?gallery=1&theme=light"></iframe>


to remove the popup, edit the /power_gallery/galleries/grid_lightbox/js/gallery.js file.

remove this code:
//tooltips
this.tips = new Tips(this.thumbs.images, {
className: 'pg-gl-tip',
offset: {'x': -125, 'y': 20}
});

Sign in to reply to this post

lecgraphx381289

Hi again...I found that js code and the hover went away. THANK YOU!

That additional code in the iFrame worked!! You're awesome. It REALLY helps to have responsive support for this. MUCH appreciated!

Sign in to reply to this post

Jason ByrnesWebAssist

glad to hear it is working.

Sign in to reply to this post

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...