Alignment of Images

Vagabond97 · Post by **Vagabond97** » 19 Nov 2010, 00:32

Hello,

I implemented the Phoca Gallery Plugin as follows into the article:

<p>09.10.2010 <strong>Steelwing</strong> {phocagallery view=category|categoryid=63|imagerandom=1|imageshadow=none|displayname=0|displaydetail=0|displaydownload=0|displaybuttons=0|displaydescription=0|enableswitch=0|overlib=0|piclens=0|float=left|displayimgrating=0|pluginlink=1|type=1}, <strong>Van Canto</strong> {phocagallery view=category|categoryid=64|imagerandom=1|imageshadow=none|displayname=0|displaydetail=0|displaydownload=0|displaybuttons=0|displaydescription=0|enableswitch=0|overlib=0|piclens=0|float=left|displayimgrating=0|pluginlink=1|type=1}, <strong>Blind Guardian</strong>{phocagallery view=category|categoryid=65|imagerandom=1|imageshadow=none|displayname=0|displaydetail=0|displaydownload=0|displaybuttons=0|displaydescription=0|enableswitch=0|overlib=0|piclens=0|float=left|displayimgrating=0|pluginlink=1|type=1}, <em>Philipshalle Düsseldorf (D)</em></p>
<p>05.-08.08.2010 <strong>Wacken Open Air XXI</strong>,...

The output then looks like this:

Is it possible that the new-lines are avioded and everything is shown in one line? Also not influencing the next paragraph as it has happened here?

Best regards,

Vagabond

Post by **Jan** » 22 Nov 2010, 22:28

Hi, does this occurs with standard template?

Vagabond97 · Post by **Vagabond97** » 22 Nov 2010, 22:38

Hello Jan,

I use ja_purity in version 1.2 but also with beez 1.0 and rhuk_milkyway 1.0.2 it looks like this.

Yakult · Post by **Yakult** » 27 Nov 2010, 20:12

I'm using beez as well and I'd love to get it all on one line. I've been playing with it for the last two hours but I can't seem to work it out... any help would be greatly appreciated!

Post by **Jan** » 01 Dec 2010, 20:31

Hi, can I see the site where this occurs (with rhuk_milky way, to see the html)?

Vagabond97 · Post by **Vagabond97** » 01 Dec 2010, 22:42

Hello Jan,

I made a codesnapshot of the site with rhuk_milky_way 1.0.2 as template and the site, where it occurs. The Joomla version is 1.5.22.

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de-de" lang="de-de" >
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <meta name="robots" content="index, follow" />
  <meta name="keywords" content="joomla, Joomla" />
  <meta name="title" content="Veranstaltungen" />
  <meta name="author" content="JZ" />
  <meta name="description" content="Joomla! - dynamische Portal-Engine und Content-Management-System" />
  <meta name="generator" content="Joomla! 1.5 - Open Source Content Management" />
  <title>Veranstaltungen</title>
  <link href="/joomla/templates/rhuk_milkyway/favicon.ico" rel="shortcut icon" type="image/x-icon" />
  <link rel="stylesheet" href="/joomla/components/com_phocagallery/assets/phocagallery.css" type="text/css" />
  <link rel="stylesheet" href="/joomla/media/system/css/modal.css" type="text/css" />
  <script type="text/javascript" src="/joomla/media/system/js/mootools.js"></script>
  <script type="text/javascript" src="/joomla/media/system/js/caption.js"></script>
  <script type="text/javascript" src="/joomla/media/system/js/modal.js"></script>
  <script type="text/javascript">

		window.addEvent('domready', function() {

			SqueezeBox.initialize({});

			$$('a.modal-button').each(function(el) {
				el.addEvent('click', function(e) {
					new Event(e).stop();
					SqueezeBox.fromElement(el);
				});
			});
		});
  </script>
  <style type="text/css">
 #sbox-window {background-color:#6b6b6b;padding:2px} 
 #sbox-overlay {background-color:#000000;} 

 </style>
  <style type="text/css">
 .pgplugin1 {border:1px solid #e8e8e8 ; background: #fcfcfc ;}
 .pgplugin1:hover, .pgplugin0.hover {border:1px solid #b36b00 ; background: #f5f5f5 ;}
 .pgplugin2 {border:1px solid #e8e8e8 ; background: #fcfcfc ;}
 .pgplugin2:hover, .pgplugin1.hover {border:1px solid #b36b00 ; background: #f5f5f5 ;}
 .pgplugin3 {border:1px solid #e8e8e8 ; background: #fcfcfc ;}
 .pgplugin3:hover, .pgplugin2.hover {border:1px solid #b36b00 ; background: #f5f5f5 ;}

 </style>
  <!--[if lt IE 8]>
<link rel="stylesheet" href="/joomla/components/com_phocagallery/assets/phocagalleryieall.css" type="text/css" />
<![endif]-->


<link rel="stylesheet" href="/joomla/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="/joomla/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="/joomla/templates/rhuk_milkyway/css/template.css" type="text/css" />
<link rel="stylesheet" href="/joomla/templates/rhuk_milkyway/css/blue.css" type="text/css" />
<link rel="stylesheet" href="/joomla/templates/rhuk_milkyway/css/blue_bg.css" type="text/css" />
<!--[if lte IE 6]>
<link href="/joomla/templates/rhuk_milkyway/css/ieonly.css" rel="stylesheet" type="text/css" />
<![endif]-->

</head>
<body id="page_bg" class="color_blue bg_blue width_fmax">
<a name="up" id="up"></a>
<div class="center" align="center">
	<div id="wrapper">
		<div id="wrapper_r">
			<div id="header">
				<div id="header_l">
					<div id="header_r">
						<div id="logo"></div>
						
					</div>
				</div>
			</div>

			<div id="tabarea">
				<div id="tabarea_l">
					<div id="tabarea_r">
						<div id="tabmenu">
						<table cellpadding="0" cellspacing="0" class="pill">
							<tr>
								<td class="pill_l">&nbsp;</td>
								<td class="pill_m">
								<div id="pillmenu">
									
								</div>
								</td>
								<td class="pill_r">&nbsp;</td>
							</tr>
							</table>
						</div>
					</div>
				</div>
			</div>

			<div id="search">
				
			</div>

			<div id="pathway">
				
			</div>

			<div class="clr"></div>

			<div id="whitebox">
				<div id="whitebox_t">
					<div id="whitebox_tl">
						<div id="whitebox_tr"></div>
					</div>
				</div>

				<div id="whitebox_m">
					<div id="area">
									

						<div id="leftcolumn">
															<div class="module_menu">
			<div>
				<div>
					<div>
											<ul class="menu"><li class="item1"><a href="http://localhost/joomla/"><span>Startseite</span></a></li><li class="item3"><a href="/joomla/index.php?option=com_phocagallery&view=category&id=8&Itemid=3"><span>Konzerte</span></a></li><li class="item2"><a href="/joomla/index.php?option=com_phocagallery&view=category&id=7&Itemid=2"><span>Eishockey</span></a></li><li class="item6"><a href="/joomla/index.php?option=com_phocagallery&view=category&id=9&Itemid=6"><span>Landschaft</span></a></li><li id="current" class="active item12"><a href="/joomla/index.php?option=com_content&view=article&id=4&Itemid=12"><span>Veranstaltungen</span></a></li><li class="item7"><a href="/joomla/index.php?option=com_content&view=article&id=1&Itemid=7"><span>Ausrüstung</span></a></li><li class="item4"><a href="/joomla/index.php?option=com_phocaguestbook&view=phocaguestbook&id=1&Itemid=4"><span>Gästebuch</span></a></li><li class="item11"><a href="https://localhost/joomla/index.php?option=com_contact&view=contact&id=1&Itemid=11"><span>Kontakt</span></a></li><li class="item10"><a href="/joomla/index.php?option=com_content&view=article&id=2&Itemid=10"><span>Impressum</span></a></li></ul>					</div>
				</div>
			</div>
		</div>
	
												</div>

												<div id="maincolumn">
													
							<table class="nopad">
								<tr valign="top">
									<td>
										<table class="contentpaneopen">
<tr>
		<td class="contentheading" width="100%">
					Veranstaltungen			</td>
						<td align="right" width="100%" class="buttonheading">
		<a href="/joomla/index.php?view=article&catid=38%3Abegruessung&id=4%3Averanstaltungen&format=pdf&option=com_content&Itemid=12" title="PDF" onclick="window.open(this.href,'win2','status=no,toolbar=no,scrollbars=yes,titlebar=no,menubar=no,resizable=yes,width=640,height=480,directories=no,location=no'); return false;" rel="nofollow"><img src="/joomla/images/M_images/pdf_button.png" alt="PDF"  /></a>		</td>
		
				<td align="right" width="100%" class="buttonheading">
		<a href="/joomla/index.php?view=article&catid=38%3Abegruessung&id=4%3Averanstaltungen&tmpl=component&print=1&layout=default&page=&option=com_content&Itemid=12" title="Drucken" onclick="window.open(this.href,'win2','status=no,toolbar=no,scrollbars=yes,titlebar=no,menubar=no,resizable=yes,width=640,height=480,directories=no,location=no'); return false;" rel="nofollow"><img src="/joomla/images/M_images/printButton.png" alt="Drucken"  /></a>		</td>
		
				<td align="right" width="100%" class="buttonheading">
		<a href="/joomla/index.php?option=com_mailto&tmpl=component&link=aHR0cDovL2xvY2FsaG9zdC9qb29tbGEvaW5kZXgucGhwP29wdGlvbj1jb21fY29udGVudCZ2aWV3PWFydGljbGUmaWQ9NDp2ZXJhbnN0YWx0dW5nZW4mY2F0aWQ9Mzg6YmVncnVlc3N1bmcmSXRlbWlkPTEy" title="E-Mail" onclick="window.open(this.href,'win2','width=400,height=350,menubar=yes,resizable=yes'); return false;"><img src="/joomla/images/M_images/emailButton.png" alt="E-Mail"  /></a>		</td>
					</tr>
</table>

<table class="contentpaneopen">
<tr>
	<td valign="top">
		<span class="small">
			Geschrieben von: JZ		</span>
		&nbsp;&nbsp;
	</td>
</tr>

<tr>
	<td valign="top" class="createdate">
		Donnerstag, den 18. November 2010 um 21:59 Uhr	</td>
</tr>


<tr>
<td valign="top">
<p>Hier eine Übersicht über Veranstaltungen, die ich besucht habe, bzw. noch besuchen werde. Sollte es Bilder dieser Veranstaltung geben, so sind Miniaturvorschauen angezeigt. Bei einem Klick auf diese gelangen Sie sofort zum Bericht und der zugehörigen Bildergalerie</p>
<p> </p>
<h1>Kommende Veranstaltungen:</h1>
<p> </p>
<h2>Konzerte:</h2>
<p> </p>
<p>04.-06.08.2011 <strong>Wacken Open Air XXII</strong>, <em>Wacken (D)</em></p>
<p>23.03.2011 <strong>Within Temptation</strong>, <em>E-Werk Köln (D)</em></p>
<p>11.12.2010 <strong>Revamp</strong>, <em>Atak Enschede (NL)</em></p>
<p> </p>
<p> </p>
<p> </p>
<hr />
<p> </p>
<p> </p>
<h1>Vergangene Veranstaltungen:</h1>
<p> </p>
<h2>Konzerte:</h2>
<p> </p>
<p>23.-24.10.2010 <strong>Metal Female Voices Fest VIII</strong>, <em>Oktoberhallen Wieze (BE) (Pythia, Godyva, Sceptical Minds, Unsun, Dylath-Leen, 69 Chambers, Visions of Atlantis, Tristania, Kryptaria, Revamp, Arch Enemy, Diabulus in Musica, The Agonist, Sarah Jezebel Deva, Leaves' Eyes, Epica)</em></p>
<p>09.10.2010 <strong>Steelwing</strong> <div class="phocagallery">
<div style="float:left;padding:3px;">
<a class="no-popup" title="Steelwing_08" href="/joomla/index.php?option=com_phocagallery&view=category&id=63:20101009steelwing-philipshalleduesseldorf" >
<img src="/joomla/images/phocagallery/concerts/2010_10_09_Steelwing_Duesseldorf/thumbs/phoca_thumb_s_Steelwing_08.jpg" alt="Steelwing_08" width="50" height="37" /></a></div></div>, <strong>Van Canto</strong> <div class="phocagallery">
<div style="float:left;padding:3px;">
<a class="no-popup" title="Van_Canto_11" href="/joomla/index.php?option=com_phocagallery&view=category&id=64:20101009vancanto-philipshalleduesseldorf" >
<img src="/joomla/images/phocagallery/concerts/2010_10_09_Van_Canto_Duesseldorf/thumbs/phoca_thumb_s_Van_Canto_11.jpg" alt="Van_Canto_11" width="50" height="37" /></a></div></div>, <strong>Blind Guardian</strong><div class="phocagallery">
<div style="float:left;padding:3px;">
<a class="no-popup" title="Blind_Guardian_16" href="/joomla/index.php?option=com_phocagallery&view=category&id=65:20101009blindguardian-philipshalleduesseldorf" >
<img src="/joomla/images/phocagallery/concerts/2010_10_09_Blind_Guardian_Duesseldorf/thumbs/phoca_thumb_s_Blind_Guardian_16.jpg" alt="Blind_Guardian_16" width="50" height="37" /></a></div></div>, <em>Philipshalle Düsseldorf (D)</em></p>
<p style="margin-bottom: 0cm;">05.-08.08.2010 <strong>Wacken Open Air XXI</strong>, <em>Wacken (D) (Fiddlers Green, Red Hot Chili Pipers, Soul Stealer, Mambo Kurt, Alice Cooper, Iron Maiden, Amorphis, Il Nino, Voivod, The Boss Hoss, Kamelot, Tarja, Grave Digger, Slayer, Anvil, Atrocity, Degradead, Crucified Barbaras, Overkill, Delain, WASP, Stratovarius, Edguy, Candlemass, Soulfly, Tiamat, U. D. O.)</em></p>
<p style="margin-bottom: 0cm;">24.04.2010 <strong>Within Temptation</strong>, <em>Evenementenhal Steenwijk (NL)</em></p>
<p style="margin-bottom: 0cm;">26.03.2010 <strong>In Legend</strong>, <strong>Van Canto</strong>, <em>Stahlwerk Düsseldorf (D)</em></p>
<p style="margin-bottom: 0cm;">20.03.2010 <strong>Stream of Passion</strong>, <strong>Epica</strong>, <em>Atak Enschede (NL)</em></p>
<p style="margin-bottom: 0cm;">09.01.2010 <strong>Trail of Tears</strong>, <strong>Epica</strong>, <em>Hedon Zwolle (NL)</em></p>
<p style="margin-bottom: 0cm;">06.12.2009 <strong>Bad Religion</strong>, <strong>Rammstein</strong>, <em>Gelredome Arnheim (NL)</em></p>
<p style="margin-bottom: 0cm;">17.11.2009 <strong>Beauty and the Beast Festival</strong>, <em>Turock Essen (D) (Elis, Stream of Passion, Sirenia, Atrocity, Leaves' Eyes)</em></p>
<p style="margin-bottom: 0cm;">17-18.10.2009 <strong>Metal Female Voices Fest VII</strong>,<em> Oktoberhallen Wieze (BE) (Pinky Doodle Poodle, Whyzdom, Unsun, Manic Movement, Kivimetsan Druidi, Amberian Dawn, Autumn, Flowing Tears, Krypteria, Midnattsol, Delain, Epica, To-Mera, Coronatus, Lahannya, Deadlock, Stream of Passion, Darzamat, Van Canto, Trail of Tears, Leaves' Eyes, Doro, Tarja)</em></p>
<p style="margin-bottom: 0cm;">16.08.2008 <strong>Lauren Harris</strong>, <strong>Kamelot</strong>, <strong>Within Temptation</strong>, <strong>Iron Maiden</strong>, <em>TT-Circuit Assen (NL)</em></p>
<p style="margin-bottom: 0cm;">19.03.2008 <strong>Krieger</strong>, <strong>Pain</strong>, <strong>Nightwish</strong>, <em>Wesfalenhalle Dortmund (D)</em></p>
<p style="margin-bottom: 0cm;">07.02.2008 <strong>Keith Caputo</strong>, <strong>Within Temptation & Metropole Orchestra</strong>, <em>Ahoy Rotterdam (NL)</em></p>
<p style="margin-bottom: 0cm;">21.01.2008 <strong>Disco Ensemble</strong>, <strong>Linkin Park</strong>, <em>Lanxess Arena Köln (D)</em></p>
<p style="margin-bottom: 0cm;">24.11.2007 <strong>Threshold</strong>, <strong>Agua de Annique</strong>, <strong>Within Temptation</strong>, <em>Beursgebouw Eindhoven (NL)</em></p>
<p style="margin-bottom: 0cm;">16.11.2007 <strong>Die Ärzte</strong>, <em>Westfalenhalle Dortmund (D)</em></p>
<p style="margin-bottom: 0cm;">10.10.2007 <strong>Delain</strong>, <strong>The 69 Eyes</strong>, <strong>Within Temptation</strong>, <em>Köln E-Werk (D)</em></p>
<p style="margin-bottom: 0cm;">15.05.2005 <strong>Red Dawn</strong>, <strong>Revolverheld</strong>, <strong>Silbermond</strong>,<em> Emslandhallen Lingen (D)</em></p>
<p style="margin-bottom: 0cm;">13.03.2004 <strong>Tape</strong>, <strong>Limp Bizkit</strong>, <em>Philipshalle Düsseldorf (D)</em></p>
<p style="margin-bottom: 0cm;">29.04.2003 <strong>Underwater Circus</strong>, <strong>Guano Apes</strong>, <em>Turbinenhalle Oberhausen (D)</em></p>
<p style="margin-bottom: 0cm;">17.01.2003 <strong>My Balloon</strong>, <strong>Guano Apes</strong>, <em>Ebertbad Oberhausen (D)</em></p>
<p style="margin-bottom: 0cm;"> </p>
<p> </p>
<h2>Sonstiges:</h2>
<p> </p>
<p style="margin-bottom: 0cm;">20.10.2007 <strong>TV Total Stock Car Crash Challenge</strong>, <em>Arena auf Schalke Gelsenkirchen (D)</em></p>
<p style="margin-bottom: 0cm;">03.06.2005 <strong>Jürgen von der Lippe</strong>, <em>Emscher-Lippe Halle Gelsenkirchen (D)</em></p>
<p style="margin-bottom: 0cm;">21.05.2003 <strong>Atze Schröder</strong>, <em>Audimax Uni Bochum (D)</em></p>
<p style="margin-bottom: 0cm;"> </p>
<h2>Eishockey:</h2>
<p> </p>
<p style="margin-bottom: 0cm;">07.-23.05.2010 <strong>Eishockey WM</strong>, <em>Arena auf Schalke Gelsenkirchen und Lanxess-Arena Köln (D) (alle Spiele in Köln und Gelsenkirchen)</em></p>
<p style="margin-bottom: 0cm;">12.04.2003 <strong>Deutschland-Dänemark</strong>,<em> Eissporthalle Nordhorn (D)</em></p>
<p style="margin-bottom: 0cm;">06.11.2002 <strong>Deutschland-Kanada</strong>, <em>Kölnarena Köln (D)</em></p>
<p style="margin-bottom: 0cm;">28.04.-13.05.2001 <strong>Eishockey WM</strong>, <em>Kölnarena Köln (D) (Deutschland-Schweiz, Deutschland-Tschechien, Schweden-Lettland, Deutschland-Finnland, Schweden-Russland)</em></p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>

</td>
</tr>

<tr>
	<td class="modifydate">
		Zuletzt aktualisiert am Dienstag, den 23. November 2010 um 23:31 Uhr	</td>
</tr>
</table>
<span class="article_separator">&nbsp;</span>

										
									</td>
																	</tr>
							</table>

						</div>
						<div class="clr"></div>
					</div>
					<div class="clr"></div>
				</div>

				<div id="whitebox_b">
					<div id="whitebox_bl">
						<div id="whitebox_br"></div>
					</div>
				</div>
			</div>

			<div id="footerspacer"></div>
		</div>

		<div id="footer">
			<div id="footer_l">
				<div id="footer_r">
					<p id="syndicate">
						
					</p>
					<p id="power_by">
	 				 	Powered by <a href="http://www.joomla.org">Joomla!</a>.
						Gültiges <a href="http://validator.w3.org/check/referer">XHTML</a> und <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>.
					</p>
				</div>
			</div>
		</div>
	</div>
</div>


</body>
</html>

Post by **Jan** » 06 Dec 2010, 23:23

Hi, I need to see it direct on your site (because of all loaded CSS)

Did you try to change the type of categories view (in parameters)

Jan

Vagabond97 · Post by **Vagabond97** » 09 Jan 2011, 14:50

Hi Jan,

sorry, that it took so long, but I reworked my homepage and was finally yesterday able to upload it to the server. So you can find the issue live on the following site (it is the same with all standard templates and my modified one).

Site with misalignments

Hope you can find something that can help solving the issue.

Best regards,

Vagabond97

Post by **Jan** » 09 Jan 2011, 20:23

Hi, please let me know the exactly link to the article where this occurs, I cannot find it on the site?

Vagabond97 · Post by **Vagabond97** » 10 Jan 2011, 00:23

Hello Jan,

I already posted the exakt link. If you scroll a little bit down, you should see 3 pictures like in my first post. The link works on two different computers of mine and shows the issue in Internet Explorer, Firefox and Opera.
If it should not work, then go to www.sanctaterra.de, click on the link "Veranstaltungen" on the left menu and scroll a little bit down, then you should see the three pictures like in my first thread. The pictures should be in one line, but somehow a newline is added after each of them messing up the layout completely.

Phoca Forum

Alignment of Images

Alignment of Images

Re: Alignment of Images

Re: Alignment of Images

Re: Alignment of Images

Re: Alignment of Images

Re: Alignment of Images

Re: Alignment of Images

Re: Alignment of Images

Re: Alignment of Images

Re: Alignment of Images