Problema con css

marcomg

Utente Attivo
19 Nov 2011
204
0
16
Ho un problema con i css!!!
Ho preso un template già fatto si internet e lo sto usando per un programmino in php, ma ho un problema credo con i css!!!
Credo ci sia una incongruenza con i css di questo tema con quelli dell'editor visuale openwysiwyg

schermatanv.png


Infatti se inserisco i javascript si vede come da immagine allegata!!
Ora ho disattivato i javascript, ma mi serve quell'editor!!
Ho notato che togliendo i css al tema l'editor si visualizza bene!!

Questa è la pagina del template (manca la chiusura perchè questo è solo l'header):

Non fate caso alle "\" serve solo per il php!!
HTML:
<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">
<html xmlns=\"http://www.w3.org/1999/xhtml\">
<head>
	<title>Style playground for Granite Glass</title>
	<meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\" />
	<meta http-equiv=\"imagetoolbar\" content=\"no\" />
	<meta name=\"keywords\" content=\"\" />
	<meta name=\"description\" content=\"\" />
	<meta name=\"author\" content=\"\" />
	<meta name=\"copyright\" content=\"\" />	  
	<meta name=\"revisit-after\" content=\"3 days\" />
	<link href=\"$dir_install/$template_folder/css/style.css\" rel=\"stylesheet\" type=\"text/css\" />
</head>

<body>
<ul class=\"hide\"><li><a href=\"#body\">Skip to content</a></li></ul>
<div id=\"container\">
	<div id=\"header\">
	    <h1><a href=\"$dir_install/index.php\">Mail<span>Auto</span>Distruggente</a></h1>		
	</div>
    
	<div id=\"body\">
		<ul id=\"nav\">
			<li class=\"first\"><a href=\"#\"><small><small><small><small><small><small><small><small><small><small><small><small><small><small><small>#</small></small></small></small></small></small></small></small></small></small></small></small></small></small></small></a></li>
			<li><a href=\"$dir_install/index.php\">Home page</a></li>
			<li><a href=\"$dir_install/sendform.php\">Crea testo autodistruggente</a></li>
			<li><a href=\"$dir_install/instructions.php\">Istruzioni</a></li>
			<li><a href=\"#\"><small><small><small><small><small><small><small><small><small><small><small><small><small><small><small>#</small></small></small></small></small></small></small></small></small></small></small></small></small></small></small></a></li>
		</ul>
		<div id=\"content\"><div>

E questi sono i css:

Codice:
/* ================================================================ **

** style.css

** ---------------------------------------------------------------- **

** Created: 05-05-08 (dd-mm-yy)

** Author: onedollartemplates.com

** Template: Granite Glass

** ================================================================ */





/* ---------------------------------------------------------------- **

** Generic

** ---------------------------------------------------------------- */

html { font-size: 76%; }

body {

	background: #333 url(../img/bg.gif);

	font-family: "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;

	font-size: 1.1em;

	line-height: 1.5em;

	color: #333;

	text-align: center;

	margin: 0;

	padding: 0;

	}



/* headers */

h2, h3, h4, h5, h6 { 

	color: #099; 

	margin: 0; 

	font-weight: normal;

	font-family: "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif; letter-spacing: -1px;

	}

h2 { font-size: 1.8em; margin: 25px 0 15px; padding-bottom: 15px; border-bottom: 1px solid #ccc; }

h3 { font-size: 1.6em; margin: 25px 0 15px; }

h4 { font-size: 1.4em; margin: 20px 0 10px; }

h5 { font-size: 1.2em; margin: 20px 0 5px; }	

h6 { font-size: 1em; margin: 20px 0 0; }



/* text */

p { margin: 15px 0; }

acronym { cursor: help; }

pre, code, blockquote { 

	margin: 15px 0; 

	border: 1px dashed #ddd; 

	padding: 15px; 

	display: block; 

	background: #fff url(../img/grey_grad_.jpg) repeat-x 0 -130px; 

	color: #666; 

	}

blockquote { 

	font-family: "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif; border: 1px solid #ddd; 

	padding: 0 15px 0 15px;

	background-color: #eee;

	min-height: 60px; 

	}

* html blockquote { height: 60px; }	



/* links */

a { text-decoration: underline; color: #099; outline: none; }

a:hover { text-decoration: none; }



/* images */

img { border: 10px solid #ddd; padding: 1px; background-color: #fff; }	

a img { }

a:hover img { border-color: #eee; }

img.right { margin: 0 0 20px 20px; }

img.left { margin: 0 20px 20px 0; }



/* lists */

ul, ol, dl { margin: 15px 0 15px 20px; padding: 0; }

ul { list-style-type: disc; }

ul ul, ol ol { margin-top: 0; margin-bottom: 0; }

ol { margin-left: 25px; }

dl { margin-left: 0; }

dl dt { font-weight: bold; margin-top: 15px; }

dl dd { margin: 0; }

dl dt, li { color: #099; }

li span { color: #333; }



/* tables */

table { margin: 15px 0; border: 1px solid #ddd; border-collapse: collapse; }

table th, 

table td { padding: 10px 15px; text-align: left; }

table thead th { 

	font-family: "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif; 

	background-color: #099; 

	color: #fff; 

	font-weight: normal; 

	font-size: 1.1em;

	border: 1px solid #099;

	}

table tbody th { background-color: #ddd; }

table tbody th, 

table tbody td { border-top: 1px solid #ddd; }



/* forms */

form { background: url(../img/grey_grad_.jpg) repeat-x; border: 1px solid #ddd; padding: 0; margin: 25px 0; }

form fieldset { border: 0; padding: 10px 25px 15px; margin: 0; }

form fieldset legend { display: none; }

form p { height: 1%; }

form p:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; }

form p label {  

	font-size: 1em; 

	color: #333; 

	float: left; 

	display: block; 

	width: 30%; 

	margin-right: 20px; 

	font-family: "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif; }

form p input,

form p select,

form p textarea { 

	font-size: 1em; 

	color: #333; 

	border: 1px solid #ddd; 

	padding: 8px; 

	background-color: #eee; 

	width: 55%; 

	font-family: Tahoma, Arial, Helvetica, sans-serif; 

	}

form p select { width: 57.5%; }

form ul.fieldlist { margin: -30px 0 10px 33%; padding: 0; list-style-type: none; }

form ul.fieldlist li { color: #333; padding: 0 30px 5px 0; white-space: nowrap; }

form input.btn,

a.btn { 

	width: auto; 

	overflow: visible;

	border: 0;

	background: #099 url(../img/image_.jpg) repeat-x 0 -30px; 

	padding: 8px 10px;

	cursor: pointer; 

	color: #fff;

	text-decoration: none;  

	font-weight: bold;

	}

a.btn:hover { background-color: #ccc; color: #333; }	



/* horizontal rule */

hr { border: 0; height: 1px; background-color: #ddd; color: #ddd; margin: 30px 0 0; }



/* classes */

.left { float: left; }

.right {float: right; }

.hide { display: none; }



/* list of links */

ul.links { list-style-type: none; margin-left: 0; }

ul.links li { margin: 5px 0; }



/* list of images */

ul.images { margin-left: -15px; margin-bottom: 0; padding: 15px 0 0; list-style-type: none; height: 1%; width: 104%; }

* html ul.images { width: 100%; }

ul.images:after { content: "."; clear: both; display: block; visibility: hidden; height: 0; }

ul.images li { float: left; margin: 0; padding: 0 0 15px 15px; }

ul.images li img { vertical-align: middle; }



/*------------------------------------------------------------*

**  Container

**------------------------------------------------------------*/

#container {

	margin: 0 auto;

	width: 760px;

	}



/*------------------------------------------------------------*

**  Header

**------------------------------------------------------------*/

#header { background: url(../img/header_.png) no-repeat; }



/* Logo */

#header h1 { 

	font-family: "Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif; 

	font-size: 2.3em;

	font-weight: normal;

	color: #099;

	margin: 0;

	padding: 40px 0;

	letter-spacing: -1px;

	}

#header h1 a { text-decoration: none; color: #099; }

#header h1 a:hover { text-decoration: none; }

#header h1 span { color: #fff; }



/* if you would like to replace the logo with 

an image, comment out the above logo code and

uncomment the following */

/* 

#header h1 {

	background: url(../img/logo.gif) no-repeat;

	width: [your-logo-width-here]px;

	height: [your-logo-height-here]px;	

	margin: 0;

	float: left;

	}	

#header h1 a {

	display: block;

	height: 100%;

	text-indent: -9999px;

	outline: none;

	}

*/	



/*------------------------------------------------------------*

**  Body

**------------------------------------------------------------*/	

#body { padding: 20px; background: #222 url(../img/body_.png) repeat-x; }



/*------------------------------------------------------------*

**  Navigation

**------------------------------------------------------------*/

ul#nav {

	margin: 0 0 20px;

	padding: 0;

	list-style-type: none;

	border-top: 1px solid #535457;

	border-bottom: 1px solid #050A10;

	height: 1%;

	}

ul#nav:after {	

	content: ".";

	clear: both;

	display: block;

	visibility: hidden;

	height: 0;

	}

ul#nav li {

	/* this width needs changing 

	depending on the amount of links. 

	Divide 100% by the amount of links 

	and set the value here. 

	e.g. 5 links: 100/5 = 20% */ 	

	width: 20%;

	float: left; 

	margin: 0; 

	font-size: 1.1em;

	background: #3C3C3C url(../img/nav_over_.png) no-repeat 50% 100%;

	}	

ul#nav li a {

	display: block; 

	background: #3C3C3C url(../img/nav_.png) repeat-x 50% 100%;

	padding: 11px 0 14px;

	color: #fff;

	text-decoration: none;

	border-right: 1px solid #535457;

	border-left: 1px solid #050A10;

	position: relative;	

	} 	

ul#nav li.first a {	border-left-color: #535457; }

ul#nav li a:hover { background-color: transparent; background-image: none; }

ul#nav li.on a,

ul#nav li.on a:hover { background-image: url(../img/nav_on_.png); }



/*------------------------------------------------------------*

**  Content

**------------------------------------------------------------*/

#content { background-color: #fff; padding: 2px; text-align: left; }

#content div { background: url(../img/content_.png) repeat-x; padding: 1px 20px 15px; min-height: 195px; }

* html #content div { height: 195px; }

#content div:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; }

#content div div { background-image: none; padding: 0; min-height: 0; }

* html #content div div { height: 1%; }



#content #sub { padding: 0 0 0 20px; }

#content #main { padding: 0 20px 0 0; }



#content #main { width: 466px; float: left; background: url(../img/main_.png) no-repeat 100% 0%; } 

#content #sub { width: 164px; float: right; }



#home #content #sub { 

	padding: 0 20px 0 0; 

	width: 340px; 

	float: left; 

	background: url(../img/sub_.png) no-repeat 100% 0%; 

	}

#home #content #main { 

	padding: 0 0 0 20px; 

	float: right; 

	width: 290px; 

	background-image: none; 

	}

	

#content #sub h2 { font-size: 1.6em; padding-bottom: 10px; margin-bottom: 10px; }	





/*------------------------------------------------------------*

**  Footer

**------------------------------------------------------------*/

#footer { 

	padding: 0 20px; 

	background-color: #222; 

	height: 1%; 

	font-size: 0.9em;

	color: #ccc;

	margin-top: -20px;

	}	

#footer:after {

	content: ".";

	clear: both;

	visibility: hidden;

	display: block;

	height: 0;

	}
 

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.046
150
63
PR
www.borgo-italia.it
ciao
guarda che non è semplice rispondere perche mettere gli occhi su qualcosa fatto da altri non è sempre immediato.
comunque se quello che sborda e la barra di formattazione dei testi di openwysiwyg da qualche parte nel js mi sembra che ci siano delle istruzioni per la sua larghezza (della barra e del campo di testo) per cui (se c'è) devi modificarla alle tue esigenze
 

marcomg

Utente Attivo
19 Nov 2011
204
0
16
Chiedo scusa per l'impazienza!!
Allora, hai ragione, ma ci avevo già provato e non cambia nulla! Credo che il problema sia colpa dei css che interferiscono con openwysiwyg e lo fanno visualizzare allungato. Se disattivo i css di questo tema (con tutto ciò che ne consegue) l'editor si visualizza alla perfezione!!! Se utilizzo un altro tema che ho fatto io (bruttissimo, la grafica non è il mio forte) senza css funziona tutto alla perfezione.
Non è che siam bravissimo con i css...
I sorgenti vi possono essere utili per aiutarmi?
 
Discussioni simili
Autore Titolo Forum Risposte Data
L problema collegamento file css con html HTML e CSS 1
S problema con css bootstrap3 HTML e CSS 4
Emix Problema con creazione form css/mobile HTML e CSS 3
F [Javascript] Problema funzione jquery con elementi css esterni Javascript 1
A [WordPress] Problema CSS con diversi browser WordPress 4
S Problema con Form CSS HTML e CSS 1
berry94mf Problema con include e css PHP 1
V Problema Rollover con css HTML e CSS 1
M problema con media query CSS HTML e CSS 1
D Problema collegamento file css con html HTML e CSS 4
S Problema con il css di un font HTML e CSS 2
A Problema gestione layout con css HTML e CSS 11
F problema con sfondo CSS HTML e CSS 2
C Problema con il CSS per il comando text-align HTML e CSS 10
M css html problema con explorer help HTML e CSS 0
G problema con css PHP 9
B Problema di inserimento "menu con css" in pagina web "con tabelle" HTML e CSS 5
M problema css con ie8! help HTML e CSS 0
K problema con current css HTML e CSS 0
L problema con menù css HTML e CSS 1
T problema con i css ... explorer visualizza male... HTML e CSS 2
I Problema con i CSS su diversi browser HTML e CSS 3
S Problema con CSS IE 7 e XP HTML e CSS 2
M Problema CSS nei widget con sfondo sfumato HTML e CSS 0
R Problema con i css in standard mode HTML e CSS 3
N [PHP+HTML+CSS] Problema con un div HTML e CSS 4
R problema con il css dei link HTML e CSS 2
S Piccolo problema con i CSS HTML e CSS 2
I Problema CSS con joomla e phpbb [Era: joomla e phpbb] Joomla 2
G Css, problema margine con explorer HTML e CSS 0
F [CSS] Problema con IE e div fixed HTML e CSS 2
R Problema con pop-pu in css HTML e CSS 4
E Problema con CSS con 3 colonne HTML e CSS 5
O problema con dvr dahua xvr5116 IP Cam e Videosorveglianza 0
G Problema con Xampp Web Server 1
andrea barletta Problema con miniature comandi Photoshop 0
I problema con alice Posta Elettronica 0
N Problema con position absolute e overflow HTML e CSS 4
L Problema con inner join PHP 11
K [php] Problema con inner join PHP 4
K [PHP] Problema con variabili concatenate. PHP 1
O problema con query PHP 4
I problema con 2 account Posta Elettronica 1
E Problema accesso a file con app sviluppata con MIT APP INVENTOR 2 Sviluppo app per Android 0
M Problema con Try Catch PHP 0
Sergio Unia Problema con gli eventi del mouse su una data table: Javascript 2
T PROBLEMA CON SESSIONI PHP 3
T ALTRO PROBLEMA CON ARRAY PHP PHP 1
R problema con else PHP 0
T PROBLEMA CON ARRAY PHP 8

Discussioni simili