[IE] Aumento dimensione carattere

**magix2003** · 06-04-2008, 20:36

Ciao a tutti,

dopo aver allegramente sviluppato il mio sito su Firefox, oggi ho testato il tutto su IE, oltre a problemi di clearing preventivati me ne si è presentato uno molto strano. Vi faccio vedere le immagini per chiarezza:

Versione Firefox

Versione IE

Questo è il codice del css:

codice:

@CHARSET "UTF-8";

a {
	text-decoration: none;
}

a.title {
	color: black;
}

br.clear {
	clear: both;
}

div#navigation {
	float: right;
	width: 13em;
}

div#content {
	padding: 1em;
	margin-right: 13em;
	background-color: #ffffff;
}

div#footer {
	padding: 0.5em;
	clear: right;
	text-align: center;
	background-color: #6699cc;
	color: #000000;
}

body {
	font-family: arial, sans-serif;
	font-size: 76%;
	text-align: center;
}

html,body {
	margin: 0;
	padding: 0;
}

div#container {
	border-left: 2px solid #3366cc;
	border-right: 2px solid #3366cc;
	margin: 0 auto;
	width: 760px;
	text-align: left;
	background-color: #99ccff;
}

div#header {
	background-color: #3366cc;
	color: #ffff00;
}

h1,h2 {
	margin: 0;
	padding: 0;
}

h1 {
	padding-left: 0.5em;
	font-family: arial, serif;
	font-style: normal;
	font-variant: normal;
	font-weight: bold;
	font-size: 2.3em;
	font-size-adjust: none;
	font-stretch: normal;
	padding-top: 0.5em;
}

h2 {
	color: #999999;
	font-size: 1.5em;
}

div#menu ul {
	margin: 1em 0 1em 1em;
	padding: 0;
	list-style-type: none;
}

div#menu li {
	margin: 0;
	padding: 0;
}

div#menu a {
	color: #336699;
	font-family: arial, sans-serif;
	font-style: normal;
	font-variant: normal;
	font-weight: bold;
	font-size: 1.2em;
	line-height: 1.6em;
	font-size-adjust: none;
	font-stretch: normal;
	text-decoration: none;
}

div#menu a:hover {
	color: #003333;
	text-decoration: underline;
}

div#log {
	text-align: center;
}

p.login {
	text-align: left;
	padding-right: 0.5em;
}

img.validator {
	float: right;
	border: none;
}

img.validator1 {
	float:left;
}

h4 {
	margin: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	left: 0px;
	padding-bottom: 1em;
	padding-top: 0.5em;
	padding-left: 3em;
}

E questo è l'xhtml:

codice:

<?xml version="1.0" encoding="UTF-8" ?>
<!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>
<meta content="text/html; charset=UTF-8" http-equiv="content-type" />
<title>Browse | CodeBase</title>

<meta content="Giorgio Stefanoni" name="author" />
<link type="text/css" href="layout_style.css" rel="stylesheet" />

<script type="text/javascript">
<!--
function shl(b,hl) {if (hl) {b.style.border="1px solid #00c"} else {b.style.border="1px solid silver"}if (navigator && navigator.userAgent.indexOf('Opera') != -1) {b.style.visibility = "hidden";b.style.visibility = "visible";}}
// -->
</script>
<style type="text/css">
/** GALLERY */
div.list {
	margin-left: 2.5em;
}

span.title {
	margin-bottom: 1.5em;
	font-weight: bold;
	font-size: 1.3em;
}

span.author {
	font-weight: bold;
	font-size: 1.2em;
}

span.desc {
	font-size: 1.1em;
	font-weight: normal;
}

pre.code {
	margin-top: 2em;
	margin-bottom: 1em;
	border: 1px solid silver;
	background-color: #f5ffff;
	padding: 0.5em;
	width: 85%;
	color: #222;
	cursor: pointer
}

div.code {
	margin-top: 1.5em;
	margin-left: 1.5em;
	margin-bottom: 1.5em;
	border: 1px solid #0000ff;
	height: auto;
	width: auto;
	float: left;
	text-align: left;
	padding-left: 0.5em;
}

div.multi {
	float: left;
	padding: 0;
	margin: 2em;
}

div.code img {
	display: inline;
	border: 1px solid #ffffff;
}

div.code a:hover img {
	border: 1px solid #0000ff;
}

div.desc {
	text-align: center;
	font-weight: normal;
	width: 120px;
	margin: 2px;
}

p.about {
	margin-left: 1.5em;
}
</style>
</head>
<body>
<div id="container">
<div id="header">
<h1>CodeBase</h1>
<h4>Share your ideas</h4>
</div>
<div id="navigation">
<div id="menu">
<ul>
	[*] Home 
	[*] About 
	[*] Browse [/list]
</div>
<div id="log">


[Login]

[Register]</p>
</div>
</div>
<div id="content">
<h2>Class Browser:</h2>
<div>
<div class="multi">
<form action="">


<select name="NomeSelect" multiple="multiple" size="5">
	<option value="1" selected="selected">All categories</option>
	<option value="2">due</option>
	<option value="3">tre</option>
	<option value="4">quattro</option>
	<option value="5">cinque</option>
	<option value="6">sei</option>
</select></p>
</form>
</div>
<div class="multi">
<form action="">


<select name="NomeSelect" multiple="multiple" size="5">
	<option value="1" selected="selected">All sub-categories</option>
	<option value="2">due</option>
	<option value="3">tre</option>
	<option value="4">quattro</option>
	<option value="5">cinque</option>
	<option value="6">sei</option>
</select></p>
</form>
</div>
<br class="clear" />
</div>
<div class="list"><pre class="code" onmouseover="shl(this,true)"
	onmouseout="shl(this,false)"
	onclick="window.location='Filter?file=/home/giorgio/workspace/FormalLanguages/it/unibz/formallanguages/membership/Membership.java'"><span
	class="title">Title: Connection manager</span>
<span
	class="author">Author: Giorgio Stefanoni
<span
	class="desc">Desc: short description of the class</span></pre>
	<pre class="code" onmouseover="shl(this,true)"
	onmouseout="shl(this,false)"
	onclick="window.location='http://www.google.it'"><span
	class="title">Title: Connection manager</span>
<span
	class="author">Author: Giorgio Stefanoni
<span
	class="desc">Desc: short description of the class</span></pre>
	<pre class="code" onmouseover="shl(this,true)"
	onmouseout="shl(this,false)"
	onclick="window.location='http://www.google.it'"><span
	class="title">Title: Connection manager</span>
<span
	class="author">Author: Giorgio Stefanoni
<span
	class="desc">Desc: short description of the class</span></pre>
	<br class="clear" />
	</div>
<br class="clear" />
</div>
<div id="footer">


</p>


   &copy; 2008 - Creato da Giorgio Stefanoni 

Note e informazioni legali</p>
</div>
</div>
</body>
</html>

Qualcuno sa qual'è il problema?

Grazie mille

Giorgio

**Inverter** · 06-04-2008, 22:36

prova ad utilizzare una larghezza del font non in percentuale.
Può darsi che internet explorer la interpreti diversamente

**magix2003** · 07-04-2008, 08:46

Si effettivamente così funziona. Ma cosa potrei fare se io volessi tenere le misure in em? Proprio non riesco a capire che problema c'è con IE.

Discussione: [IE] Aumento dimensione carattere

Strumenti discussione

Ricerca discussione

Visualizza

[IE] Aumento dimensione carattere

Permessi di invio