Sidebar Sidebar
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

need help centering a gallery

sk3pt1c

sk3pt1c

macrumors 6502a
Original poster
Nov 29, 2005
918
6
a simulacrum
so i found this gallery that plays fullscreen, places the image at 100% width and has the visitor scroll vertically if needed via mouse movement. turns out the client doesn't like the scrolling and just wants the full pic to show in the center of the page. here's the effect as is now
(the original is here)
the bit that's styling the big photo is this:
Code: 
img.fp_preview{
    position:absolute;
    left:0px;
    top:0px;
    width:100%;
}
now, i can set this to height:100% instead of width:100% so i don't get the vertical scrolling and i see the whole image, but then i need to center it. the problem is that to center it, the parent element needs positioning, and if i add positioning to the parent div (fpgallery), that breaks it and it doesn't show the image at all...
i tried adding another div with a different name around it because fpgallery is used in the javascript and i thought me styling it may cause a conflict, but that didn't work either...
this is probably retarded and very simple to fix, but i just can't see it... help?!

ps. the javascript on the page is doing quite a lot of meddling with the CSS to make the gallery work so i'm guessing i need to play with that a bit... trouble is, it's not really my forte, sadly, so if anyone could lend a hand, i'd appreciate it greatly!

thank you!!!
 
angelwatt

angelwatt

Moderator emeritus
Aug 16, 2005
7,852
9
USA
This at least worked in Firefox using Firebug. I believe it also works in most modern browsers.
Code: 
img.fp_preview{
    position:absolute;
    left: 0;
    [COLOR="Red"][B]right: 0;[/B][/COLOR]
    top: 0;
    width: auto;
    [COLOR="Red"][B]max-width: 100%;
    max-height: 100%;[/B][/COLOR]
}
 
sk3pt1c

sk3pt1c

macrumors 6502a
Original poster
Nov 29, 2005
918
6
a simulacrum
alas, it does not work :(

i have posted an alternate page with your rule in another css file here

it stops the scrolling but does not center the image itself on the screen :(

i tried it with safari and firefox on the mac and safari, firefox and ie on windows...

this is driving me nuts :(
 
You must log in or register to reply here.
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.
Top Bottom