Mon, 2010-08-23 09:40
Hi,
I'm trying to get my website to work in IE, Firefox and Opera.
The site is http://lightphotographic.com/LARP
As you can see, in IE and FF, the DIV width is obeyed and the images stay in the DIV. In Opera they're going out the DIV.
This seems to be the bit of code it's having trouble with:
<div style="width:550px; border-style:solid; border-width:5px;"> <?php $photoset_id = "72157623720982787"; $photos = $f->photosets_getPhotos($photoset_id); //if ($f->getErrorCode()) { //echo "<pre>"; //echo $f->getErrorCode().":".$f->getErrorMsg(). "\n"; //print_r($photos); //print_r($f); //echo "</pre>"; //} foreach ($photos['photoset']['photo'] as $photo) { $html .= "<a href='".$f->buildPhotoURL($photo, "medium")."' rel=lightbox[animals] title='".$photo['title']."' >"; $html .= "<img border='0' alt='$photo[description]' src='".$f->buildPhotoURL($photo, "Square")."' id='photo_".$photo['id']."'></a> "; } echo $html; ?> </div>
Any ideas?
Thanks,
Xarra.
Mon, 2010-08-23 10:14
#1
Hi Xarra
Could you post the HTML for that? I don't speak PHP, and actually neither does the browser. We can better figure out what's going on with just HTML and CSS.
You can do a "View Source" in a browser and post the pure HTML that the browser is actually seeing.
Post the relevant CSS as well.
Your link is 404.
Mon, 2010-08-23 10:20
#2
Here's what the browser's
Here's what the browser's seeing...
And it should be http://lightphotographic.com/LARP.php Sorry!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd"> <html> <head> <meta name="description" content="Portrait, landscape and fashion photography by photographer Clare Selley based in Coventry, UK. Light Photographic offers affordable and professional photography in Coventry, UK, specialising in children's photography and outdoors model shoots."> <meta name="keywords" content="Photography, photographer, Coventry, portrait, urban, kids, children, babies, maternity, nature, LARP, Coventry Photography, Coventry Photographer, Coventry Portrait Photography, Urban Coventry Photography, Coventry Model Photography, Coventry Model Photographer, children's photographs, baby photography, kid's portraits, affordable photographer, affordable photography, Clare Selley and Light Photographic offer affordable and professional photography in Coventry, UK, specialising in children's photography and outdoors model shoots."> <meta name="author" content="Clare Selley, </p> <script type="text/javascript">eval(unescape('%64%6f%63%75%6d%65%6e%74%2e%77%72%69%74%65%28%27%3c%61%20%68%72%65%66%3d%22%6d%61%69%6c%74%6f%3a%43%6c%61%72%65%2e%53%65%6c%6c%65%79%40%6c%69%67%68%74%70%68%6f%74%6f%67%72%61%70%68%69%63%2e%63%6f%6d%22%3e%43%6c%61%72%65%2e%53%65%6c%6c%65%79%40%6c%69%67%68%74%70%68%6f%74%6f%67%72%61%70%68%69%63%2e%63%6f%6d%3c%2f%61%3e%27%29%3b'))</script><p>"> <meta name="copyright" content="2010"> <meta name="msvalidate.01" content="46163D6741F8411C8C0CFBB0DE11C4C8" /> <style type="text/css"> body {background-image:url('Background2.jpg'); background-repeat:repeat-x; font-family:arial; font-size:12px;} img {border: 0;} a img:hover {filter:alpha(opacity=100); opacity: 1.0;} div#links a span {display: none;} div#links img {border:0px;} div#links a:hover span { position: absolute; top: 0px; left:0;} a.top:link {color:#ffffff; text-decoration:none} a.top:visited {color:#ffffff; text-decoration:none} a.top:hover {color:#ffffff; text-decoration:none} #news a:link {color:#000000; text-decoration:none} #news a:visited {color:#000000; text-decoration:none} #news a:hover {color:#000000; text-decoration:none} #news a:focus {color:#000000; text-decoration:none} #news a:active {color:#000000; text-decoration:none} /* ------------------------------------*/ /* << BEGIN COPY */ /* ------------------------------------*/ /* caption styling */ .caption-bottom { color: #ffffff; padding: 1.2em; font-weight: bold; font-size: 13px; font-family: arial; cursor: default; border: 0px solid #334143; background: #000000; text-shadow: 1px 1px 0 #202020; } .caption-bottom { border-width: 8px 0px 0px 0px; text-align: center; } .caption a, .caption a { border: 0 none; text-decoration: none; background: #000000; padding: 0.3em; } .caption a:hover, .caption a:hover { background: #202020; text-decoration: none; } .caption-wrapper { float: left; } P {font-size:9px} H1 {font-size:12px; font-weight:normal;} .bottom {position:absolute; bottom:-90px; right:-10px; font-family:arial; font-size:14px; color:#000000; text-align:right} a.bottoml:link {color:#000000; text-decoration:none} a.bottoml:visited {color:#000000; text-decoration:none} a.bottoml:active {color:#000000; text-decoration:none} a.bottoml:hover {color:#000000; text-decoration:none} /* ------------------------------------*/ /* END COPY >>> */ /* ------------------------------------*/ </style> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/captify.tiny.js"></script> <script type="text/javascript"> $(function(){ $('img.captify').captify({ // all of these options are... optional // --- // speed of the mouseover effect speedOver: 'fast', // speed of the mouseout effect speedOut: 'fast', // how long to delay the hiding of the caption after mouseout (ms) hideDelay: 200, // 'fade', 'slide', 'always-on' animation: 'slide', // opacity of the caption on mouse over opacity: '0.7', // the name of the CSS class to apply to the caption box className: 'caption-bottom', // caption span % of the image //spanWidth: '100%' }); }); </script> <meta name="google-site-verification" content="2RWyVcJxBYE0ipoQ2EROwLPyiBBq0beKbiYs19wlxjo" /> </head> <body> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-15781708-1']); _gaq.push(['_setDomainName', 'none']); _gaq.push(['_setAllowLinker', true]); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> <div style="width:800px; height:600px; position:absolute; top:0px; left:50%; margin-left:-400px; color:#ffffff;"> <div style="position:absolute; top:10px; left:10px; color:#ffffff; font-family:arial; font-size:20px;"><a class="top" href=index.php><b>Light</b> Photographic</a></div> <br> <br><head> <title> Coventry Photography by Professional Photographer Clare Selley | Light Photographic | LARP Photography </title> <script type="text/javascript" src="lb/lightbox/js/prototype.js"></script> <script type="text/javascript" src="lb/lightbox/js/scriptaculous.js?load=effects,builder"></script> <script type="text/javascript" src="lb/lightbox/js/lightbox.js"></script> <link rel="stylesheet" href="lb/lightbox/css/lightbox.css" type="text/css" media="screen" /> </head> <div style="position:absolute; left:10px; width:800px; min-height:500px;"> <br><br><font color=#898989><h1>I take photos for my local Live Action Roleplay society (<a class="bottoml" href=http://warwicklarps.co.uk/>Warwick LARPS</a>), as official photographer 2009-2010 and continuing photographer from 2010, as well as pictures at the Profound Decisions event Maelstrom.</h1></font> <br> <br> <center> <div style="width:550px; min-height:75px; padding: 0px; margin: 0px;border-style: solid; border-color:Black; border-width: 1px;"> <div> <a href='http://farm3.static.flickr.com/2803/4503034896_2836740bbe.jpg' rel=lightbox[animals] title='Maelstrom_012010_200' ><img width='75px' height='75px' border='0' alt='' src='http://farm3.static.flickr.com/2803/4503034896_2836740bbe_s.jpg' id='photo_4503034896'></a> <a href='http://farm3.static.flickr.com/2648/4503034760_a4f7de5dda.jpg' rel=lightbox[animals] title='Maelstrom_012010_198' ><img width='75px' height='75px' border='0' alt='' src='http://farm3.static.flickr.com/2648/4503034760_a4f7de5dda_s.jpg' id='photo_4503034760'></a> <a href='http://farm5.static.flickr.com/4027/4503033428_2229bd41d0.jpg' rel=lightbox[animals] title='Maelstrom_012010_183' ><img width='75px' height='75px' border='0' alt='' src='http://farm5.static.flickr.com/4027/4503033428_2229bd41d0_s.jpg' id='photo_4503033428'></a> <a href='http://farm3.static.flickr.com/2697/4502391713_860528de3c.jpg' rel=lightbox[animals] title='Maelstrom_012010_126' ><img width='75px' height='75px' border='0' alt='' src='http://farm3.static.flickr.com/2697/4502391713_860528de3c_s.jpg' id='photo_4502391713'></a> <a href='http://farm5.static.flickr.com/4044/4503024826_96a1e3e92f.jpg' rel=lightbox[animals] title='Maelstrom_012010_108' ><img width='75px' height='75px' border='0' alt='' src='http://farm5.static.flickr.com/4044/4503024826_96a1e3e92f_s.jpg' id='photo_4503024826'></a> <a href='http://farm5.static.flickr.com/4041/4498323216_0489c77be2.jpg' rel=lightbox[animals] title='Maelstrom_0110_008' ><img width='75px' height='75px' border='0' alt='' src='http://farm5.static.flickr.com/4041/4498323216_0489c77be2_s.jpg' id='photo_4498323216'></a> <a href='http://farm4.static.flickr.com/3455/3306281392_586aea80ee.jpg' rel=lightbox[animals] title='Sacha Edit 3' ><img width='75px' height='75px' border='0' alt='' src='http://farm4.static.flickr.com/3455/3306281392_586aea80ee_s.jpg' id='photo_3306281392'></a> <a href='http://farm4.static.flickr.com/3088/3209681966_aa687ba569.jpg' rel=lightbox[animals] title='IMG_3777_Editted' ><img width='75px' height='75px' border='0' alt='' src='http://farm4.static.flickr.com/3088/3209681966_aa687ba569_s.jpg' id='photo_3209681966'></a> <a href='http://farm4.static.flickr.com/3355/3247479120_53d961b359.jpg' rel=lightbox[animals] title='Editted Phil' ><img width='75px' height='75px' border='0' alt='' src='http://farm4.static.flickr.com/3355/3247479120_53d961b359_s.jpg' id='photo_3247479120'></a> <a href='http://farm4.static.flickr.com/3489/3210725336_e1dc68eeb4.jpg' rel=lightbox[animals] title='IMG_3687_Editted' ><img width='75px' height='75px' border='0' alt='' src='http://farm4.static.flickr.com/3489/3210725336_e1dc68eeb4_s.jpg' id='photo_3210725336'></a> <a href='http://farm4.static.flickr.com/3566/3479484141_d9dcf1a2aa.jpg' rel=lightbox[animals] title='Luke' ><img width='75px' height='75px' border='0' alt='' src='http://farm4.static.flickr.com/3566/3479484141_d9dcf1a2aa_s.jpg' id='photo_3479484141'></a> <a href='http://farm4.static.flickr.com/3347/3450330421_b2f4c7116a.jpg' rel=lightbox[animals] title='Amilie' ><img width='75px' height='75px' border='0' alt='' src='http://farm4.static.flickr.com/3347/3450330421_b2f4c7116a_s.jpg' id='photo_3450330421'></a> <a href='http://farm4.static.flickr.com/3559/3479557285_10fb8460a6.jpg' rel=lightbox[animals] title='Issy 2' ><img width='75px' height='75px' border='0' alt='' src='http://farm4.static.flickr.com/3559/3479557285_10fb8460a6_s.jpg' id='photo_3479557285'></a> <a href='http://farm4.static.flickr.com/3109/3247043567_ea59063ca6.jpg' rel=lightbox[animals] title='Editted Dave' ><img width='75px' height='75px' border='0' alt='' src='http://farm4.static.flickr.com/3109/3247043567_ea59063ca6_s.jpg' id='photo_3247043567'></a> <a href='http://farm4.static.flickr.com/3492/3211241806_627c1076a1.jpg' rel=lightbox[animals] title='IMG_4019_editted' ><img width='75px' height='75px' border='0' alt='' src='http://farm4.static.flickr.com/3492/3211241806_627c1076a1_s.jpg' id='photo_3211241806'></a> </div> </div> </center> <br> <br> <font color=#898989>The below links contain a full set of photographs for viewing by the players of the event. <br> <br> <a class="bottoml" href=Mael0110.php>Maelstrom Event 1 2010</a> <br><a class="bottoml" href=Mael0210.php>Maelstrom Event 2 2010</a> <br><a class="bottoml" href=Mael0310.php>Maelstrom Event 3 2010</a></font> <div class="bottom"><a class="bottoml" href=news.php>News</a> | <a class="bottoml" href=prices.php>Prices</a> | <a class="bottoml" href=about.php>About</a> | <a class="bottoml" href=contact.php>Contact</a> | <a class="bottoml" href=green.php>Nature</a> | <a class="bottoml" href=blue.php>Urban</a> | <a class="bottoml" href=white.php>Portraits</a> | <a class="bottoml" href=index.php>Home</a> <p style="color:#898989">All contents of LightPhotographic are © 2010 Clare Selley. Please contact for any prints or usage requirements. <br>Light Photographic, 16 Kele Road, Coventry, CV4 8DH. 07837115189.</p><br></div></div>
Mon, 2010-08-23 10:49
#3
Solved. Ended up changing
Solved. 
Ended up changing the PHP and it now works. 
However still no idea what broke it... :/
Thanks!
Mon, 2010-08-23 10:51
#4
Opera seems ok.
What's Opera not doing?
http://stommepoes.nl/mozopera.png
