come posso realizzare questa semplice pagina nel migliore dei modi?

**kevin0101** · 02-04-2008, 19:54

come posso realizzare una pagina con lo sfondo esattamente diviso per metà in verticale.
metà bianco e metà nero?
con al centro una scritta, sera sul bianco e bianca sul nero centrata a sua volta???

grazieeeeeeee

**fcaldera** · 02-04-2008, 20:39

Non ho IE per cui provalo tu su quel browser

codice:

<!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" lang="it" xml:lang="it">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
           
        <style>
        * { margin: 0; padding; 0; }
        html, body { height:100%; width: 100%; }
        
        div { 
            height      : 100%; 
            width       : 49.9%; 
            position    : relative; 
            float       : left;
            font-size   : 10px;
        }
        
        p { 
            position    : absolute; 
            height      : 1em; 
            font-size   : 4em;
            top         : 50%;
            left        : 0;
            margin-top : -0.5em;
            text-align  : center; 
            display     : block;
            width       : 100%;
        }
        
        #left  { background: #000; color: #fff; }
        #right { background: #fff; color: #000; }
        </style>
    </head>
    
    <body>
    
        <div id="left">

Nero</p></div>
        <div id="right">

Bianco</p></div>

    </body>
</html>

**Braco** · 02-04-2008, 20:39

Originariamente inviato da kevin0101
come posso realizzare una pagina con lo sfondo esattamente diviso per metà in verticale.
metà bianco e metà nero?
con al centro una scritta, sera sul bianco e bianca sul nero centrata a sua volta???

grazieeeeeeee

Puoi creare 2 div uno vicino all'altro, se lo sfondo è largo 1000px fai:

#sinistro{
float:left;
background-color:black;
width:500px;
height:500px; //questo puoi allungarlo
text-align:center;
}

#destro{
float:left;
background-color:white;
width:500px;
height:500px; //questo puoi allungarlo
text-align:center;
}

**kevin0101** · 02-04-2008, 20:51

Grazie a tutti!!!

ho provato il primo, GRAZIE fcaldera, proprio come volevo io.

anche con ie tutto ok.

C'è il modo di centrare le scritte fino al bordo centrale della pagina?

grazie

**Braco** · 02-04-2008, 20:55

Originariamente inviato da kevin0101
Grazie a tutti!!!

ho provato il primo, GRAZIE fcaldera, proprio come volevo io.

anche con ie tutto ok.

C'è il modo di centrare le scritte fino al bordo centrale della pagina?

grazie

cambia questo text-align : center; in left o right

**kevin0101** · 02-04-2008, 21:31

si ma se lo faccio entrambe le parole bianco e nero vanno o a destra o a sinistra io vorrei che quella a destra andasse a destra(centro) e quella a sinistra andasse a sinistra (centro)
non so se mi sono spiegata, in modo tale che le due parole siano a centro pagina.

**Braco** · 02-04-2008, 21:36

Originariamente inviato da kevin0101
si ma se lo faccio entrambe le parole bianco e nero vanno o a destra o a sinistra io vorrei che quella a destra andasse a destra(centro) e quella a sinistra andasse a sinistra (centro)
non so se mi sono spiegata, in modo tale che le due parole siano a centro pagina.

Iserisci qui i codici così:

#left { background: #000; color: #fff; text-align:right; }
#right { background: #fff; color: #000; text-align:left; }

**Braco** · 02-04-2008, 21:38

...e da questo codice togli il rosso

p {
position : absolute;
height : 1em;
font-size : 4em;
top : 50%;
left : 0;
margin-top : -0.5em;
text-align : center;
display : block;
width : 100%;

**kevin0101** · 02-04-2008, 21:51

perfetto grazie!!!!

Discussione: come posso realizzare questa semplice pagina nel migliore dei modi?

Strumenti discussione

Ricerca discussione

Visualizza

come posso realizzare questa semplice pagina nel migliore dei modi?

Re: come posso realizzare questa semplice pagina nel migliore dei modi?

Permessi di invio