layout a scomparsa? [CSS]

**Ja]{|e** · 07-10-2004, 11:47

finalmente ho provato a utilizzare sti benedetti fogli di stile, mi sono scervellata un po' per capire come funzionassero, soprattutto impostare un layout a tre colonne. Seguendo la guida di html.it sui layout con i css, ho abozzato qualcosa

il problema è che quando apro la pagina col browser mi compare questo

ovvero l'immagine che ho messo in ripetizione nelle due colonne si sovrappone alla colonna centrale

la cosa ancora più inquietante è che quando passo sopra col mouse sulle scritte nascoste della colonna centrale, oppure ci passo sopra un'altra finestra, si vede

che nella mia bozza è proprio quello che si deve vedere

VVoVe:

**cyberman** · 07-10-2004, 13:50

essendo un problema più di css/html che di grafica ti sposto su html

**Francis87** · 07-10-2004, 13:56

puoi mostrarci i codicilli che usi?

**Ja]{|e** · 07-10-2004, 15:40

Originariamente inviato da Francis87
puoi mostrarci i codicilli che usi?

codice:

<head>
<link rel=stylesheet href="index.css" type="text/css">
</head>

<body>

    <div id="container">

     <div id="container2">

        <div id="header">[img]immagini/up.gif[/img]</div>


        <div id="navigation">

<p class="pulsanti">wè</p>
<p class="pulsanti">wè</p>
<p class="pulsanti">wè</p>
<p class="pulsanti">wè</p>
<p class="pulsanti">wè</p>
<p class="pulsanti">wè</p>
<p class="pulsanti">wè</p>
<p class="pulsanti">wè</p>
<p class="pulsanti">wè</p>
</div>

        <div id="extra">
<p class="pulsanti">wè</p>
<p class="pulsanti">wè</p>
<p class="pulsanti">wè</p>
        </div>
       <div id="content">



testo</p>


testo</p>


testo</p>


testo</p>


testo</p>


testo</p>


testo</p>
</div>
        <div id="footer">mail</div>
     </div>
    </div>

</body>

codice:

H1 {
position: relative;
top: 10px;
color: #FFF;
font-family: Courier New, Courier;
font-size: 20pt;
text-align: center;
}

H2 {
position: relative;
top: 170px;
color: #9A0102;
font-family: Courier New, Courier;
font-size: 12pt;
text-align: left;
}

p {
color: #000;
font-family: Courier New, Courier;
font-size: 9pt;
text-align: left;
}

p.pulsanti {
color: #000;
wheight: bold;
font-family: Courier New, Courier;
font-size: 19pt;
text-align: left;
}

a {
font-weight: 800;
color: #FFF;
font-family: Courier New, Courier;
font-size: 12pt;
text-align: left;
}


/*stili per il layout fisso con background*/
html {
margin: 0;
padding: 0;
}

body{
margin: 0;
padding: 0;
font-family: arial,sans-serif;
font-size: 76%;
text-align: center;
scrollbar-face-color: #9A0100; 
scrollbar-highlight-color: black; 
scrollbar-shadow-color: white; 
scrollbar-arrow-color: white; 
scrollbar-base-color: white; 
scrollbar-3d-light-color: brown; 
scrollbar-dark-shadow-color: black;
}

div#container{
width:100%;
clear:both; 
text-align:center; 
margin: 0 auto;
border-width: 0 1px; 
border-style:solid; 
background: url(immagini/pat.gif) repeat top right;
}

div#container2{
background: url(immagini/pat.gif) repeat top left;
text-align: left;
}

/*stili specifici per il layout*/

div#header {
clear:both; 
height: 30px;
text-align:right; 
padding: 0px 0;
background-color: #000; 
color: #000
}

div#navigation{
float: left;
width: 160px;
\width:170px;
w\idth:160px;
padding: 1em 0 0 10px
}

div#extra{
float: right; 
width: 160px;
\width:170px;
w\idth:160px;
padding: 1em 0 5px
}

div#content{
float: both; 
background-color: #fff;
margin: 0 170px;
padding: 1em 10px;
border-width: 0 1px; 
border-style: solid;
border-color: #000;
}

div#footer{
clear:both; 
text-align:center; 
padding: 5px 0;
background-color: #000; 
color: #000
}

**Marcolino's** · 07-10-2004, 19:48

E tutto ciò per fare una paginetta con tre box e un banner?
vai su questo sito dai e trova la guida per realizzare un layout a tre colonne.
E' molto più semplice e più stabile, inoltre è veramente ben spiegato, con una tag board dove leggere i commenti.

**Daddo83** · 07-10-2004, 20:00

http://www.inknoise.com/experimental/layoutomatic.php

anche a me serviva un layout a tre colonne

**Ja]{|e** · 08-10-2004, 10:50

Originariamente inviato da Marcolino's
E tutto ciò per fare una paginetta con tre box e un banner?
vai su questo sito dai e trova la guida per realizzare un layout a tre colonne.
E' molto più semplice e più stabile, inoltre è veramente ben spiegato, con una tag board dove leggere i commenti.

e che so io, ho seguito la guida di html.it per i layout con i css

**Ja]{|e** · 08-10-2004, 10:56

Originariamente inviato da Daddo83
http://www.inknoise.com/experimental/layoutomatic.php

anche a me serviva un layout a tre colonne

layout-o-matic mi da un codice simile al mio

codice:

		#container {
			border: 1px solid gray;
			margin: 10px;
			margin-left: auto;
			margin-right: auto;
			padding: 10px;
		}

		#banner {
			padding: 0px;
			margin-bottom: 0px;
			background-color: rgb(213, 219, 225);
		}

		#content {
			padding: 0px;
			margin-left: 200px;
			margin-right: 200px;
			background-color: gray;
		}

		#sidebar-a {
			float: left;
			width: 200px;
			\width: 200px;
			w\idth: 200px;
			margin: 0;
			margin-right: 0px;
			padding: 0px;
			background-color: rgb(235, 235, 235);
		}

		#sidebar-b {
			float: right;
			width: 200px;
			\width: 200px;
			w\idth: 200px;
			margin: 0;
			margin-left: 0px;
			padding: 0px;
			background-color: rgb(235, 235, 235);
		}

		#footer {
			clear: both;
			padding: 0px;
			margin-top: 0px;
			background-color: rgb(213, 219, 225);
		}

Discussione: layout a scomparsa? [CSS]

Strumenti discussione

Ricerca discussione

Visualizza

layout a scomparsa?

Permessi di invio