IMG e INPUT (SELECT): disallineamento verticale.

**daguanno** · 11-12-2006, 11:18

Ho il seguente problema: voglio affiancare un'immagine ad una select per creare una sorta di toolbar.

Purtroppo non riesco ad allinearli verticalmente, la select scende rispetto all'immagine sia su FF che su IE.

Allego anche un'immagine dimostrativa.

Il CSS è il seguente:

* {
color: Black;
font-size: 100%;
margin:0;
padding:0;
text-decoration: none;
}

div.tb {
background-image: url(img/tb_bg.gif);
background-repeat: repeat-x;
height: 25px;
}
select.tb {
font-size: 8pt;
}
img.tb {
height: 25px;
width: 25px;
}

Il codice HTML invece è questo:

<?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" xml:lang="it" lang="it">
<head>
<title>HTML ediDag</title>
<link rel="stylesheet" type="text/css" media="screen" href="HTML_ediDag.css" />
<script type="text/javascript" src="/HTML_ediDag.js"></script>
<meta name="keywords" content="" />
<meta name="description" content="" />
</head>
<body>
<div id="tb_formattazione" name="tb_formattazione" class="tb">
[img]img/tb_ico.gif[/img]
<select id="tb_stile" name="tb_stile" class="tb">
<option selected>stile</option>
<option value="<h1>">Titolo 1</option>
<option value="<h2>">Titolo 2</option>
<option value="<h3>">Titolo 3</option>
<option value="<h4>">Titolo 4</option>
<option value="<h5>">Titolo 5</option>
<option value="<h6>">Titolo 6</option>
<option value="<h7>">Titolo 7</option>
</select>
</div>
</body>
</html>

**fcaldera** · 11-12-2006, 12:14

vedo che hai usato il prologo xml

<?xml version="1.0" encoding="utf-8"?>

inizia togliendo questa riga (genera comportamenti disattesi su IE) e prova a rifare i tuoi test

**daguanno** · 11-12-2006, 12:29

Il problema non è IE.
Non credo che togliere l'indicazione della codifica utilizzata, sia l'approccio migliore.

Comunque ho risolto in questo modo (per ora):

Css

select.tb {
float: left;
font-size: 8pt;
margin-top: 3px;
margin-left: 3px;
}
img.tb {
float: left;
}

Discussione: IMG e INPUT (SELECT): disallineamento verticale.

Strumenti discussione

Ricerca discussione

Visualizza

IMG e INPUT (SELECT): disallineamento verticale.

Permessi di invio