un <td> sul bordo inferiore

**frifrini** · 23-05-2005, 17:17

Salve a tutti,
premetto che non sono un genio di html... ma ve ne accorgerete subito!
Ho realizzato un sito in flash in cui il filmato swf viene posizionato al centro della pagina. Fin quì ok, avrei bisogno poi di inserire in tutte le pagine sul bordo inferiore una fascetta contenente i soliti "all right reseverd..".
Ho provato a fare una tabella 100% sia in larghezza che in altezza con dentro due <td>, il primo impostato con altezza al 98% e l'altro a piè pagina con altezza fissa a 15 px.
Con firefox funziona ma non con IE, ho provato altre cose ma allora funzionano con IE e non con firefox.
Consigli?

se volete vedere la pagina:qui

**Sky** · 23-05-2005, 20:04

Basta applicare qualche regola tramite CSS ad un semplice div :)

Tra i tag <head></head>:

In fondo al codice html, prima del tag </body>:

Ciao ciao :)

**frifrini** · 24-05-2005, 07:44

GRAZIE MILLE!!!
il risultato è perfetto!
Adesso però me ne approfitto... potrei inserire una regola per centrarmi anche il file swf che sta sopra gli "all rights..." eliminando così del tutto le tabelle dalla pagina?

Grazie ancora!
Sarà bene che io mi metta a studiare i css

**Sky** · 24-05-2005, 10:28

C'è un trucchetto che uso spesso, ma l'ho sempre usato per centrare orizzontalmente, non verticalmente. Speriamo che ora non dia problemi :P

codice:

div#filmato {
  position: relative;
  top: 50%;
  height: 430px;
  margin-top: -215px
}

Il trucco sta nel mandare il <div> prima a metà schermo con "top: 50%;" e poi centrarlo impostando un margin-top negativo a metà dell'altezza del livello, in questo caso -215px.

codice:

<div id="filmato">
  codice per flash...
</div>

Fammi sapere se ci sono problemi :)

**frifrini** · 24-05-2005, 11:59

Scusa ero dovuto uscire.
Intanto grazie!
C'è un problemino in effetti, il filmato finisce in angolo a sx, sono più propenso a pensare di essere io ad aver sbagliato qualche cosa.

qui di seguito ti posto il codice della pagina:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it" lang="it">
<head>
<style type="text/css">
div#filmato {
position: relative;
top: 50%;
height: 430px;
margin-top: -215px
}
div#footer {
position: absolute;
bottom: 0px; /* per posizionarlo a 0px dal bordo inferiore del tag <body> */
left: 0px;
width: 100%;
height: 15px;
line-height: 15px; /* per ottenere il testo centrato in verticale */
padding: 0px; /* togliamo dell'eventuale padding che creerebbe problemi */
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: center;
color: #999; /* colore del testo */
background-color: #333;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>mimo </title>
</head>
<BODY bgcolor="#000000"leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div id="filmato">
<object classid="clsid

27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="760" height="430">
<param name="movie" value="index.swf" />
<param name="quality" value="high" />
<embed src="index.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="760" height="430"></embed></object>
</div>
<div id="footer">
<div>All right reserved © mimo 2005</div>
</div>
</body>
</html>

se vuoi vedere cosa succede adesso metto in linea la pagina:
qui

**frifrini** · 24-05-2005, 14:31

ho "risolto" la centratura in orizzontale mettendo applicando uno style a body in questa maniera:

body{
text-align: center;
}

non so se sia correto ma sembra funzionare mentre per la centratura verticale buio completo!!!

**frifrini** · 25-05-2005, 14:52

Grazie Sky,trovato il problema.
Ovviamente di base c'era la mia ignoranza in fatto di css. Non avevo capito infatti che i valori negativi devono essere la metà delle misure del filmato!

ecco il codice funzionante se qualcuno dovesse ritrovarsi a leggere questo T.

div#filmato {
position:absolute;
top:50%;
left:50%;
width:760px;
height:430px;
margin-left:-380px;
margin-top: -215px;
padding:0;
}

**SuperMariano81** · 10-01-2006, 17:07

so che è un 3d vecchio ma per non aprirne di nuovi ho effettuato una ricerca ed è quello che cercavo io!

perfetto!

**frifrini** · 11-01-2006, 13:32

fai attenzione a IE 5.2 per mac, può dare dei problemi

Discussione: un <td> sul bordo inferiore

Strumenti discussione

Ricerca discussione

Visualizza

un <td> sul bordo inferiore

Permessi di invio