/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] jquery picture viewer – remove text decoration??

This should be simple but I’m apparently doing something bass-ackwards. I’m using PiroBox to display pictures in my gallery ([url]http://www.pirolab.it/pirobox/white.html[/url]) and for some reason the layout will not work for me. When I use an h3 tag for a new section of pictures, it appears to the right of the last picture rather than on a new line.

Any clues what I’m doing wrong?

page address:
[url]http://www.kitchenprose.com/gmtest/gallery.html[/url]

Here’s the relevant style sheet CSS (followed by page html):

[CODE].demo a{ float:left; margin:0; padding:0; margin:5px 10px 5px 20px!important; margin:5px 10px 5px 10px; display:block; background:url(images_gallery/bg_tms.jpg) no-repeat; border:none; width:90px; height:90px;}

.demo a img{ float:left; margin:0; padding:0; margin:9px 0 0 10px; background:url(images_gallery/bg_tms.jpg) no-repeat; border:none; width:70px; height:70px;}

[/CODE]

HTML code:

[CODE]
<h3 class=”gallery”>APPEARANCES</h3>

<div class=”demo”><a href=”images_gallery/gallery_test1.jpg” class=”pirobox_gall” title=”DWTS backstage”><img src=”images_gallery/gallery_test1_thumb.jpg” /></a>
</div>
<div class=”demo”><a href=”images_gallery/gallery_test2.jpg” class=”pirobox_gall” title=”DWTS backstage”><img src=”images_gallery/gallery_test2_thumb.jpg” /></a>
</div>
<div class=”demo”><a href=”images_gallery/gallery_test3.jpg” class=”pirobox_gall” title=”GMA for Sexiest Man Alive announcement”>
<img src=”images_gallery/gallery_test3_thumb.jpg” /></a></div>

<h3 class=”gallery”>FAMILY</h3>

<div class=”demo”><a href=”images_gallery/gallery_test1.jpg” class=”pirobox_gall” title=”DWTS backstage”><img src=”images_gallery/gallery_test1_thumb.jpg” /></a>
</div>
<div class=”demo”><a href=”images_gallery/gallery_test2.jpg” class=”pirobox_gall” title=”DWTS backstage”><img src=”images_gallery/gallery_test2_thumb.jpg” /></a>
</div>
<div class=”demo”><a href=”images_gallery/gallery_test3.jpg” class=”pirobox_gall” title=”GMA for Sexiest Man Alive announcement”>
<img src=”images_gallery/gallery_test3_thumb.jpg” /></a></div>
[/CODE]

Thank you very much!

to post a comment
JavaScript

2 Comments(s)

Copy linkTweet thisAlerts:
@skywalker2208Jan 23.2010 — Your js file is spelled wrong.

You have

pirobox.1_2_min.js

but it should be

js/piroBox.1_2_min.js
Copy linkTweet thisAlerts:
@lindagal2authorJan 23.2010 — Skywalker, you are wonderful. (And I should have proofed better -- sorry).

Now a followup question:

is there a way to make each section of the page start a new gallery? Right now all the pictures are in a single gallery. Worse, if I don't leave those blank "placeholder" pictures there, the heading from the next gallery section displays up with the pictures in the previous section. I've fixed it by putting dummy boxes there but it looks trashy.

Any ideas?


Thx.
×

Success!

Help @lindagal2 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...