Ver Mensaje Individual
  #3 (permalink)  
Antiguo 19/11/2010, 05:17
Avatar de Dundee
Dundee
 
Fecha de Ingreso: junio-2002
Ubicación: El Médano
Mensajes: 1.310
Antigüedad: 21 años, 10 meses
Puntos: 8
Respuesta: se rompe el diseño cuando utilizo K2

Cita:
Iniciado por inturias Ver Mensaje
Hola Dundee, como bien lo dices es nada mas que un problema de CSS, pero es como si trabajaramos a ciegas, si nos posteas tu web recibiras mas ayuda.

Saludos.
Gracias por la respuesta , pero la web no está subida está en local, voy a postear el HTML y el CSS en la medida de lo posible (porque es bastante).

Este es el index.php que tengo en el theme que he modificado
Código:
<?php
defined('_JEXEC') or die('Restricted access');
?>
<?php echo '<?xml version="1.0" encoding="utf-8"?'.'>'; ?>
<!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="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>" >
<head>
	<jdoc:include type="head" />
	<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/css/template.css" type="text/css" />
    
	<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/css/position.css" type="text/css" media="screen,projection" />
	<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/css/layout.css" type="text/css" media="screen,projection" />
	
	
	<!--[if lte IE 6]>
		<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/css/ieonly.css" rel="stylesheet" type="text/css" />
	<![endif]-->
	<!--[if IE 7]>
		<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/css/ie7only.css" rel="stylesheet" type="text/css" />
	<![endif]-->
	
</head>
<body>
	<div id="all">
		<div id="header">
			<jdoc:include type="modules" name="user3" />
			<jdoc:include type="modules" name="user4" />
          <!--
			<div id="breadcrumbs">
				<p>
					<?php echo JText::_('You are here'); ?>
					<jdoc:include type="modules" name="breadcrumb" />
				</p>
			</div>
              -->
		</div><!-- end header -->
		
		<div id="wrapper" style="border:1px #000 solid">
            	
			<div id="cuerpo" style=" width:78%; border:1px solid #F90; float:left">
                <jdoc:include type="modules" name="galeria" />
			

			<jdoc:include type="component" />
                
                
			</div><!-- end cuerpo -->      
      	<div id="right">  <!-- menu de la derecha -->

		 	 <jdoc:include type="modules" name="right" style="beezDivision" headerLevel="3" />

			 </div><!-- right -->       
       	
         
                 
                      
		</div><!-- wrapper -->
            
		

		
	</div><!-- all -->
    
    
    <div id="footer" style="clear:both">
        
			<p class="syndicate">
				
                <img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/images/uio_peq.jpg" />
		
			</p>

		</div><!-- footer -->

	<jdoc:include type="modules" name="debug" />

</body>
</html>
Y este los css principales:
position.css
Código:
*
{
	margin: 0;
	padding: 0;
}

body
{
	background: #FFFFFF;
	color: #000000;
	font-family: arial, helvetica, sans-serif;
	font-size: 100.1%;
	padding: 0px;
	text-align: center;
}

/* ################   Position ################  */
#all
{
	background: #FFFFFF;
	border: solid 0px #DBB0CD;
	color: #000000;
	font-size: 0.8em;
	margin: 0 auto;
	max-width: 993px;
	padding: 0 3px 3px 3px;
	text-align: left;
}



#header
{
	background: #fff;
	color: #000000;
	margin: 0;
	position: relative;
	text-align: right;
	border-bottom: solid 4px #ccc;
}

#contentarea,#contentarea2
{
	border: solid 0px #000;
	margin: 0;
	padding: 0px 0px 0px 0px;
	position: relative;
	overflow: hidden;
}
#wrapper { margin: 0 10px; /* background: #fff url(../images/galeria_fnd.png) no-repeat top left;  width:712px; height:305px */}
#left
{
	background: #FFFFFF;
	border-right: solid 0px #EEEEEE;
	float: left;
	margin: 20px 0 0 0;
	width: 21%;
}

#right
{
	color: #000;
	float:right;
	width:20%;
	padding-top:10px

}

#main2
{
	background: #fff;
	width:64%;
	padding: 25px 20px 20px 20px;
	position: relative;
	min-height:520px;
	float:left;


}

#main
{
	background: #fff;
	margin: 0 0px 0 0;
	position: relative;
	float:left;
	width:78%;
}

/* ###################### generell ###################### */
.unsichtbar,.u2,.invisible , .unseen
{
	display: inline;
	height: 0px;
	left: -3000px;
	position: absolute;
	top: -2000px;
	width: 0px;
	z-index: 200;
}

.wrap
{
	border: 0;
	clear: both;
	float: none;
	font-size: 1px;
	height: 0;
	line-height: 1px;
	margin: 0;
	padding: 0;
	visibility: hidden;
}

#logo
{
	font-size: 1em !important;
	font-weight: bold !important;
	position: relative;
	text-align: left;
	text-transform: none !important;
	z-index: 0;
	margin-top: 1em;
}

#logo  img { display: block; }

#logo span
{
	display: block;
	margin: 0px 0 0 100px !important;
	border-bottom: solid 1px #666;
}

/* ###############  main * ########################### */
/* position */
.leading
{
	/* background: #EFDEEA url(../images/biene.gif) no-repeat top left; */
	border: solid 1px #CCCCCC;
	color: #000000;
	margin: 30px 0px 10px 0px;
	padding: 20px 20px 40px 120px;
	position: relative;
}

.leading_separator
{
	border-bottom: solid 0px #333333;
	display: block;
	height: 10px;
	margin: 0 0 0px 0;
}

.article_separator
{
	border: solid 1px #333333;
	display: none;
	margin: 0px 0 0px 0;
}

.blog { padding: 0; }

.cols1
{
	display: block;
	float: none !important;
	margin: 0 !important;
}

.cols2 { width: 45%; }
.cols3 { width: 30%; }

.column1 , .column2
{
	border: solid 0px #D4A7C5;
	margin: 0 5px 0 0;
	position: relative;
}

.column2 , .column1
{
	float: left;
	margin: 0;
}

.column2
{
	float: right;
	margin: 0;
	width: 45%;
}

.article_row
{
	margin: 0px 0 0px 0;
	padding: 0;
	overflow: hidden;
}

.article_column
{
	border: solid 0px #ccc;
	padding: 10px 10px 10px 0;
}

.row_separator2
{
	display: block;
	clear: both;
	margin: 0;
	border: solid 0px;
}
Código:
template.css
body
{
	background: #FFFFFF;
	color: #000000;
	font-family: arial, helvetica, sans-serif;
	font-size: 100.1%;
	padding: 0px;
	text-align: center;
}



body.contentpane {

width : auto;
margin : 10px;
line-height : 1.4em;
text-align: left;
}

/* TOC */
table.contenttoc{
	float: right;
}

/* Tooltips */
.tool-tip {
	float: left;
	background: #ffc;
	border: 1px solid #D4D5AA;
	padding: 5px;
	max-width: 200px;
	text-align:left;
}

.tool-title {
	padding: 0;
	margin: 0;
	font-size: 100%;
	font-weight: bold;
	margin-top: -15px;
	padding-top: 15px;
	padding-bottom: 5px;
	background: url(../../system/images/selector-arrow.png) no-repeat;
}

.tool-text {
	font-size: 100%;
	margin: 0;
}
/* sobrescritura de estilos */
.nsp_bottom_interface .pagination li, .nsp_top_interface .pagination li {
-moz-border-radius:2px 2px 2px 2px;
background:none repeat scroll 0 0 #4379BA;
cursor:pointer;
float:left;
height:16px;
margin-right:2px;
text-indent:-999em;
width:16px;
}
Perdonar por el chorizo pero no veía otra forma de mostrar el código.
Mil gracias por la ayuda

De todas formas quiero volver a decir que he probado con otras plantillas de Joomla y sucede lo mismo (con las que estan maquetadas con tablas no pero con las que tienen DIVS si), por ello creo que el problema esta en el K2 no en el Css del theme pero bueno ahí lo dejo por si acaso.

Acabo de comprobar quitando el K2 como página de inicio y poniendo las últimas noticias que vienen por defecto en Joomla y veo que también en algunos casos el dichoso menú de la derecha se descoloca, por lo que parece que va a ser del CSS no del K2 sino del theme , pero no entiendo como pasa con tanto themes que se suponene están más que probados. Es mas , puedo asegurar que con los únicos themes que no pasa son los que además de los DIvs usan tables para maquetar , cosa que intento no tener que hacer.
__________________
Videotutoriales de Drupal

Última edición por Dundee; 19/11/2010 a las 05:41 Razón: ampliar información