Safari too fills width
malc_b - January 24, 2008 - 23:45
| Project: | Photoframe |
| Version: | 5.x-1.x-dev |
| Component: | User interface |
| Category: | bug report |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | active |
Jump to:
Description
I'm trying out this module on a test page, just an inside a . That works ok in Firefox now. I did find that I needed to set border: none; in .photoframe-table as otherwise photoframe.css on sets right and bottom so leaves left and top as defined in my template (solid).
Anyway, in Firefox it looks ok. In IE there is blank white space to the right and the photoframe fills the width of the block. Any idea how to fix this?
BTW I have jquery update installed.
#1
Safari has the same issue. (Filled blank up to the right side)
And in IE6 the "Dropshadow" is crippled - but "photoframe-round-with-white-background" is ok !?!
#2
BTW in the end I gave up trying to make IE behave and instead used PHP to get the image size. Then I use PHP to wrap photoframe in a div width of image + X, and gave the img tag a width an height property. With all that IE worked out where to centre the frame, something Firefox did straight off.
#3
Any updates on this? malc_b, can you post some code in case the module author doesn't fix things up?
#4
The code to get the image properties in php is:
$psize = getimagesize($pfile);if ($psize[0] > 600){
$psize[1] = intval($psize[1] * 600 / $psize[0]);
$psize[0] = 600;
}
I have a maximum width of 600px. For larger pictures the picture is scaled down
Then the div for the picture frame is:
<div class="pictureframe" style="width: <?php print 64+$psize[0]; ?>px;">which of course is 64px bigger than the picture to allow for the frame.
#5
In the main photoframe.css add width:auto; to .photoframe-table td {}, i.e.
.photoframe-table td {padding:0px;
border:0px;
margin:0px;
line-height:90%;
width:auto;
}
You may also want to make .photoframe-table {} as follows: -
.photoframe-table {border-collapse:collapse;
width:0%;
display:inline;
}
This allows frames to be placed side-by-side.
Works fine for IE6+7 - I can't test on Sarafi but it should do the trick.