Seite 1 von 2

Forum align

Verfasst: 17.12.2013 17:01
von Carnifexe
Ich weiß nicht, wie oft das irgendwo durchgekaut wurde oder ihr genervt werdet aber nach erfolgloser / falscher suche, musste ich es doch mal posten...

http://www.carnifexe.de/forum

das forum ist so ausgerichtet:
[X ]

Ich möchte es aber immer mittig haben:

[ X ]


Style ist redsilver



gruß euer Carnifexe

Re: Forum align

Verfasst: 17.12.2013 17:33
von Miriam
Finde in der forum/styles/RedSilver/template/overall_header.html Deines Templates:

Code: Alles auswählen

<table width="53%" cellpadding="0" cellspacing="0"> 
tausche aus gegen:

Code: Alles auswählen

<table width="53%" cellspacing="0" cellpadding="0" style="display: block; margin: auto;"> 
Beachte KB:tippstyles

Re: Forum align

Verfasst: 17.12.2013 20:08
von Carnifexe
dank dir vielmals das war das problem den cache mal leeren :P hab statt 53% nun 1024px genommen ist irgendwie sauberer :) danke nochmal !

Re: Forum align

Verfasst: 18.12.2013 17:13
von Carnifexe

Code: Alles auswählen

<!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" dir="{S_CONTENT_DIRECTION}" lang="{S_USER_LANG}" xml:lang="{S_USER_LANG}">
<head>

<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-language" content="{S_USER_LANG}" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="resource-type" content="document" />
<meta name="distribution" content="global" />
<meta name="copyright" content="2000, 2002, 2005, 2007 phpBB Group" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<link rel="shortcut icon" href="http://www.team-vorlaut.de/favicon.ico" type="image/x-icon">
<link rel="icon" href="http://www.team-vorlaut.de/favicon.ico" type="image/x-icon">

{META}
<title>{SITENAME} &bull; <!-- IF S_IN_MCP -->{L_MCP} &bull; <!-- ELSEIF S_IN_UCP -->{L_UCP} &bull; <!-- ENDIF -->{PAGE_TITLE}</title>

<link rel="stylesheet" href="{T_STYLESHEET_LINK}" type="text/css" />

<script type="text/javascript">
// <![CDATA[
<!-- IF S_USER_PM_POPUP -->
	if ({S_NEW_PM})
	{
		popup('{UA_POPUP_PM}', 400, 225, '_phpbbprivmsg');
	}
<!-- ENDIF -->

function popup(url, width, height, name)
{
	if (!name)
	{
		name = '_popup';
	}

	window.open(url.replace(/&/g, '&'), name, 'height=' + height + ',resizable=yes,scrollbars=yes,width=' + width);
	return false;
}

function jumpto()
{
	var page = prompt('{LA_JUMP_PAGE}:', '{ON_PAGE}');
	var perpage = '{PER_PAGE}';
	var base_url = '{A_BASE_URL}';

	if (page !== null && !isNaN(page) && page > 0)
	{
		document.location.href = base_url.replace(/&/g, '&') + '&start=' + ((page - 1) * perpage);
	}
}

/**
* Find a member
*/
function find_username(url)
{
	popup(url, 760, 570, '_usersearch');
	return false;
}

/**
* Mark/unmark checklist
* id = ID of parent container, name = name prefix, state = state [true/false]
*/
function marklist(id, name, state)
{
	var parent = document.getElementById(id);
	if (!parent)
	{
		eval('parent = document.' + id);
	}

	if (!parent)
	{
		return;
	}

	var rb = parent.getElementsByTagName('input');
	
	for (var r = 0; r < rb.length; r++)
	{
		if (rb[r].name.substr(0, name.length) == name)
		{
			rb[r].checked = state;
		}
	}
}

<!-- IF ._file -->

	/**
	* Play quicktime file by determining it's width/height
	* from the displayed rectangle area
	*
	* Only defined if there is a file block present.
	*/
	function play_qt_file(obj)
	{
		var rectangle = obj.GetRectangle();

		if (rectangle)
		{
			rectangle = rectangle.split(',')
			var x1 = parseInt(rectangle[0]);
			var x2 = parseInt(rectangle[2]);
			var y1 = parseInt(rectangle[1]);
			var y2 = parseInt(rectangle[3]);

			var width = (x1 < 0) ? (x1 * -1) + x2 : x2 - x1;
			var height = (y1 < 0) ? (y1 * -1) + y2 : y2 - y1;
		}
		else
		{
			var width = 200;
			var height = 0;
		}

		obj.width = width;
		obj.height = height + 16;

		obj.SetControllerVisible(true);

		obj.Play();
	}
<!-- ENDIF -->

// ]]>
</script>
</head>
<body class="{S_CONTENT_DIRECTION}">

<a name="top"></a>

<table width="1024px" cellpadding="0" cellspacing="0" style="display: block; margin: auto;">
	<tr>
		<td width="15" style="padding: 0;background: url('{T_IMAGESET_PATH}/left_bkg.gif') repeat-y; width: 15px;"></td>
		<td style="padding: 0;">

<div id="wrapheader">

				

	<table cellpadding="0" cellspacing="0" width="100%" style="height: 100px;background: url({T_IMAGESET_PATH}/top_bkg.gif) repeat-x;">
		<tr>
			<td><center>
				<table cellpadding="0" cellspacing="0">
					<tr>
						<td style="padding: 0;">
							<a href="{U_INDEX}"><img style="margin: -4px 40px -4px -4px;" src="{T_IMAGESET_PATH}/site_logo.gif" width="100%" height="100%" alt="Site Logo" /></a>
						</td><!--<td>
							<h1>{SITENAME}</h1><span class="gen">{SITE_DESCRIPTION}</span>
						</td>-->
					</tr>
				</table>
			</center></td>
		</tr>
	</table>
	
	<table id="menu_bkg" cellpadding="0" cellspacing="0" width="100%" style="height: 34px;background: url({T_IMAGESET_PATH}/menu_bkg.gif) repeat-x;">
		<tr>
			<td style="padding: 0;">
				<center>
					<a href="{U_FAQ}">{L_FAQ}</a>
							
					<!-- IF U_RESTORE_PERMISSIONS --> &nbsp;-&nbsp;<a href="{U_RESTORE_PERMISSIONS}">{L_RESTORE_PERMISSIONS}</a><!-- ENDIF -->
				
					<!-- IF S_BOARD_DISABLED and S_USER_LOGGED_IN --> &nbsp;-&nbsp;<span style="color: red;">{L_BOARD_DISABLED}</span><!-- ENDIF -->
				
					<!-- IF not S_IS_BOT -->
						<!-- IF S_USER_LOGGED_IN -->
							<!-- IF S_DISPLAY_PM --> &nbsp;-&nbsp;<a href="{U_PRIVATEMSGS}">{PRIVATE_MESSAGE_INFO}<!-- IF PRIVATE_MESSAGE_INFO_UNREAD -->, {PRIVATE_MESSAGE_INFO_UNREAD}<!-- ENDIF --></a><!-- ENDIF -->
						<!-- ELSEIF S_REGISTER_ENABLED --> &nbsp;-&nbsp;<a href="{U_REGISTER}">{L_REGISTER}</a>
						<!-- ENDIF -->
					<!-- ENDIF -->
				
					<!-- IF S_DISPLAY_SEARCH --> &nbsp;-&nbsp;<a href="{U_SEARCH}">{L_SEARCH}</a><!-- ENDIF -->
					<!-- IF not S_IS_BOT -->
						<!-- IF S_DISPLAY_MEMBERLIST --> &nbsp;-&nbsp;<a href="{U_MEMBERLIST}">{L_MEMBERLIST}</a><!-- ENDIF -->
						<!-- IF S_USER_LOGGED_IN --> &nbsp;-&nbsp;<a href="{U_PROFILE}">{L_PROFILE}</a><!-- ENDIF -->
					<!-- ENDIF -->
				
					<!-- IF not S_IS_BOT -->&nbsp;-&nbsp;<a href="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</a>&nbsp;<!-- ENDIF -->
				</center>
			</td>
		</tr>
	</table>
	
	
	<table cellpadding="0" cellspacing="0" width="100%" style="height: 30px;background: url({T_IMAGESET_PATH}/below_menu_bkg.gif) repeat-x;">
		<tr>
			<td style="padding: 0;">
				&nbsp;
			</td>
		</tr>
	</table>
	
	<div id="datebar">
		<table width="100%" cellspacing="0">
		<tr>
			<td class="gensmall"><!-- IF S_USER_LOGGED_IN -->{LAST_VISIT_DATE}<!-- ENDIF --></td>
			<td class="gensmall" align="{S_CONTENT_FLOW_END}">{CURRENT_TIME}<br /></td>
		</tr>
		</table>
	</div>

</div>

<div id="wrapcentre">

	<!-- IF S_DISPLAY_SEARCH -->
	<p class="searchbar">
		<span style="float: {S_CONTENT_FLOW_BEGIN};"><a href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a> | <a href="{U_SEARCH_ACTIVE_TOPICS}">{L_SEARCH_ACTIVE_TOPICS}</a></span>
		<!-- IF S_USER_LOGGED_IN -->
		<span style="float: {S_CONTENT_FLOW_END};"><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a> | <a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></span>
		<!-- ENDIF -->
	</p>
	<!-- ENDIF -->

	<br style="clear: both;" />

	<!-- INCLUDE breadcrumbs.html -->

	<br />

Code: Alles auswählen

<!-- IF not S_IS_BOT -->{RUN_CRON_TASK}<!-- ENDIF -->
</div>

<div id="wrapfooter">
	<!-- IF U_ACP --><span class="gensmall">[ <a href="{U_ACP}">{L_ACP}</a> ]</span><br /><br /><!-- ENDIF -->
	<span class="copyright">Powered by <a href="http://www.phpbb.com/">phpBB</a> &copy; 2000, 2002, 2005, 2007 phpBB Group<br />
	Template made by <a style="color: #444;" href="http://www.devppl.com/">DEVPPL</a> <a style="color: #444;" href="http://www.devppl.com/flash-games/">Flash Games</a>
	<!-- IF TRANSLATION_INFO --> - {TRANSLATION_INFO}<!-- ENDIF -->
	<!-- IF DEBUG_OUTPUT --><br /><bdo dir="ltr">[ {DEBUG_OUTPUT} ]</bdo><!-- ENDIF --></span>
</div>

		</td>
		<td width="15" style="padding: 0;background: url('{T_IMAGESET_PATH}/right_bkg.gif') repeat-y;"></td>
	</tr>
</table>

<table cellpadding="0" cellspacing="0" width="1024px" style="display: block; margin: auto;">
	<tr>
		<td width="77" height="44" style="padding: 0;background: url('{T_IMAGESET_PATH}/bottom_left.gif') no-repeat;"></td>
		<td height="44" style="padding: 0;background: url('{T_IMAGESET_PATH}/bottom_bkg.gif') repeat-x;">&nbsp;</td>
		<td width="77" height="44" style="padding: 0;background: url('{T_IMAGESET_PATH}/bottom_right.gif') no-repeat;"></td>
	</tr>
</table>

</body>
</html>

Das Problem is nun, dass der Footer sich dem Header nicht anpassen will, nicht mal, wenn ich ihm in der <td height="44" style="padding: 0;background: url('{T_IMAGESET_PATH}/bottom_bkg.gif') repeat-x;">&nbsp;</td>
ein width gebe, irgendwas stimmt nicht hilfe :(

MfG Carni

Re: Forum align

Verfasst: 18.12.2013 17:49
von Kirk
Carnifexe hat geschrieben:hab statt 53% nun 1024px genommen ist irgendwie sauberer :)
Ansattt 1024px nimm 100%
Carnifexe hat geschrieben:Das Problem is nun, dass der Footer sich dem Header nicht anpassen will
Wenn du das hier style="display: block; margin: auto;" löschen tust, dann passt es wieder.
Die Änderrung von Miriam war ja dafür gedacht, das die Breite unverändert bleibt, und das Forum
mittig angezeigt wird.

Re: Forum align

Verfasst: 18.12.2013 17:59
von Lehrling
Hallo,

mein Vorschlag wäre, dass du der mittleren Spalte eine Breite von 761px gibst.

LG Beate

Re: Forum align

Verfasst: 18.12.2013 22:02
von Carnifexe
Dein vorschlag, mit dem 761px ist gut, das geht in die Richtung, die ich haben will!
Aber, dann stimmt die Breite ja nur auf der Hauptseite... Geht man dann in irgendwelche Threads rein, ist es wieder falsch!


style="display: block; margin: auto;"

und 100%

Sobald ich das mache, geht der Footer komplett von links nach rechts, im ganzen Browser.
Sobald ich das drinnen habe: style="display: block; margin: auto;" ist es genau mittig, wie der Header.
Mal bildlich erläutert:


[..........|..........|..........]
[..........|_|...................] Das ist mit style="display: block; margin: auto;"


[..........|.........|.........]
[..........|______|..........] So mit einer xxxPX Angabe aber, sobald ich in einer andere Spalte gehe, die schmaler ist, dann passt der Footer nicht mehr.

[..........|..........|..........]
[ |____________________| ] So ist es ohne style="display: block; margin: auto;" und 100%

Er sollte, wenn möglich, immer die Breite des Headers bekommen.

Die .......... sind nur Platzhalter :)

Gruß Carni

Re: Forum align

Verfasst: 18.12.2013 22:13
von Miriam
Was hast Du denn selbst schon an Lösungsansätzen probiert?
Ich meine außer den, uns mittels ASCII Art aufzumalen, wie Du es haben möchtest.

Re: Forum align

Verfasst: 19.12.2013 15:17
von Carnifexe
Diese 3/4 Möglichkeiten, mehr noch nicht.

Aber dieser sog. ASCII Style, ist halt die beste Möglichkeit es zu Zeigen :)

Re: Forum align

Verfasst: 20.12.2013 11:27
von Carnifexe
Ich bekomme es nicht hin egal wie sehr ich es versuche :(