misure blocchi non conformi

valerio matrix

Nuovo Utente
7 Mag 2015
33
0
6
buongiorno... sto provando a scrivere del codice dopo un po di tempo di inattività.. sono un po' arruginito ;)
vi posto il codice in questione:
Codice:
#blocco {
	width: 300px;
	height:300px;
	background-color: rgba(255,255,255,0.7);
	border-width: 2px;
	border-style: solid;
	border-color: white;
	display: inline;
	padding: 5px 10px 5px 10px;
	margin:  5px  2px 5px  2px
}
e vi posto anche l'immagine di ciò che vedo.
Di fatto, ci dovrebbero essere 3 quadrati 300 px in linea tra il menu e il contenitore contenuti, ma sono piccolissimi. Cosa ho sbagliato?
Immagine.jpg
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.372
338
83
  1. Non puoi usare un id per tre contenitori diversi
  2. un displey inline non mi sembra appropriato
Per un consiglio più esastivo posta il codice di tutta la pagina CSS e HTML
 

valerio matrix

Nuovo Utente
7 Mag 2015
33
0
6
Lo faccio per hobby e molto probabilmente il codice non è pulito, nel senso che ci saranno cose non necessarie. Ti ho messo i due fogli di stile e la pagina html.

Codice:
body {
BACKGROUND-COLOR: rgb(166, 16, 34); /! rosso fuoco !/

}

#contenitore {
	width: 1024px;
	margin: 0 auto;
	padding: 0;
	}


#top {
	width: 1024px;
	height: 80px;
	background-color: #990033;
	border-width: 2px;
	border-style: solid;
	border-color: white;
	display:block;

	}
#top1 {
	width: 250px;
	height: 80px;
	background-color: white;
	color: rgb(25, 25, 112);
	font-family: arial, sans-serif;
	font-size: 16px;
	text-align: center;
	font-weight: bold;
	float: left;
	}
#top2 {
	width: 774px;	
	height:80px;
	background-color: green;
	background: url(../img/skyline.jpg) no-repeat;
	float:left;
	}
#menu_principal {
	width: 1024px;
	height: 30px;
	background-color: white;
	margin: 10px 0 15px 0;
	border-width: 2px;
	border-style: solid;
	border-color: white;
	
	}
		#menu_principal ul
		{
		display: block;
		margin: 5 auto;
		
		width: 1024px;
		height: 30px;
		}

		#menu_principal li
		{
		display: inline;
		margin: 0px;
		padding: 8px;
		
		}

			#menu_principal a:link, 
			#menu_principal a:visited
			{
			color: rgb(25, 25, 112);
			text-decoration:none;
			font-variant:small-caps;
			}


#contenuto {
width: 1004px;
background-color: rgba(255,255,255,0.7);
border-width: 2px;
border-style: solid;
border-color: white;
display: block;
float: left;
padding: 5px 10px 5px 10px;
margin:  20px  0px 20px  0px;
}
#footer {
	width: 1024px;
	background-color: white;
	margin: 10px 0 15px 0;
	float: left;
	border-width: 2px;
	border-style: solid;
	border-color: white;
}
Codice:
#cont_blocco {
	width: 1024px;
	height: 300px;
	display: block;
	clear: both;
	
}
	
#blocco {
	width: 312px;
	height: 300px;
	clear: none;
	float: left;
	background-color: rgba(255,255,255,0.7);
	border-width: 2px;
	border-style: solid;
	border-color: white;
	display: block;
	padding: 5px 10px 5px 10px;
	margin:  5px  2px 5px  2px;
}
Codice:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type" />
<title>Gestione Aurora 97</title>
<link rel="stylesheet" type="text/css" href="css/classi.css" />
<link rel="stylesheet" type="text/css" href="css/stile.css" />
<link rel="stylesheet" type="text/css" href="css/blocco_home.css" />
</head>

<body>
	<div id="contenitore">
		<div id="top">
			<div id="top1">
				<h1> SERVER </h1>
			</div>
			<div id="top2">
			</div>
		</div>
		<div id="menu_principal">
			<ul>
				<li><a href="index.html">HOME</a></li>
				<li><a href="soci.html">SOCI</a></li>
				<li><a href="risorseumane.html">RISORSE UMANE</a></li>
				<li><a href="contabilita.html">CONTABILITA</a></li>
				<li><a href="approvvigionamento.html">APPROVVIGIONAMENTO</a></li>
				<li><a href="mezzi.html">MEZZI</a></li>
				<li><a href="iso.html">ISO 9001</a></li>
				<li><a href="archivio.html">ARCHIVIO</a></li>
			</ul>
		</div>
		<div id="cont_blocco">
			<div id="blocco">  <!-- blocco 1 -->
			</div>
			<div id="blocco">  <!-- blocco 2 -->
			</div>
			<div id="blocco">  <!-- blocco 3 -->
			</div>
		</div>
		<div id="contenuto">
		<p> Prova </p>
		</div>
		<div id="footer">
		</div>
	</div>
</body>
</html>
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.372
338
83
01.jpg
Questo è quello che vedo io con il tuo codice senza modifiche!
Il menu non è centrato!
Cosa vuoi modificare?
 

SamTo

Utente Attivo
18 Apr 2015
40
0
6
Torino
Quoto Max 1,
Ho testato il codice senza modifiche sulle ultime versioni di IE, Chrome, Firefox e Opera, i blocchi risultano come nella schermata di Max 1 (312x300).

Quale browser utilizzi quando vedi l'errore?
 

valerio matrix

Nuovo Utente
7 Mag 2015
33
0
6
Ciao.. scusate il ritardo.
Ho aperto di nuovo la pagina e mi dava lo stesso problema, cosi ho provato a cancellare la cache e adesso va bene. Il problema ora è un altro: come faccio a centrare il testo del menù? e come posso centrare i blocchi (i tre blocchi) con i margini degli altri? non riesco a farlo con i singoli px, c'è un modo per distanziarli gli uni dagli altri in percentuale allo spazio libero che hanno o in modo automatico?
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.372
338
83
Prova a usare le misure in percentuale in margin
 

valerio matrix

Nuovo Utente
7 Mag 2015
33
0
6
Ancora non ci sono riuscito ma continuo a provare. Prima che vado troppo avanti, un'ultima cosa, non posso utilizzare lo stesso id per i tre blocchi? ne creo 3 diversi?
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.372
338
83
Un ID è un'identificatore univoco ciò vuol dire che nella stessa pagina vuole usato una sola volta, pertanto non si può dare a tre elementi uno stesso ID bisogna usare 3 ID diversi.
Se vuoi usare le stesse regole per tutti e tre bisogna che usi una classe
 

valerio matrix

Nuovo Utente
7 Mag 2015
33
0
6
grazie mille. Ora ricordo.
Per quanto riguarda i blocchi sto provando con le percentuali. la chiavi credo sia li... proverò ancora :)
 
Discussioni simili
Autore Titolo Forum Risposte Data
M [Xamarin] Rilevare le misure antropometriche di una persona puntando la fotocamera su di essa Offerte e Richieste di Lavoro e/o Collaborazione 1
G [PHP] Quali sono tutte le misure di sicurezza che un sito deve avere? PHP 1
G Testo che si adatta in grandezza alle misure di un DIV: è possibile farlo? HTML e CSS 2
Y corrispondenza misure portando un layout da photoshop in html/css Photoshop 0
C quali sono le misure di sicurezza minime per la privacy? Leggi, Normative e Fisco 0
gara1 MIT app: blocchi relazionali Sviluppo app per Android 1
trattorino [Javascript] aprire blocchi via via che si scorre Javascript 0
trattorino [PHP] blocchi div che si posizionano in alto automaticamente PHP 5
M Divisione in blocchi PHP 3
D [Risolto] Invio mail a blocchi Classic ASP 31
P Impossibile completare immediatamente l'operazione sul socket non a blocchi. PHP 1
J while dentro while per invio email blocchi PHP 0
N Invio email a blocchi PHP 9
maxbossi Aggiungere blocchi alla sidebar di vB4 VBulletin 2
C drupal: blocchi diversi per ogni "pagina" Content Management System (CMS) 5
S Inserimento Video dentro blocchi Javascript 1
M schema a blocchi! HTML e CSS 2
B Evitare che explorer blocchi pulsanti flash Flash 3
C PHP-NUKE: I blocchi LINKS CORRELATI e ARTICLE RATING PHP 0
A Explorer i suoi blocchi HTML e CSS 2
A creare blocchi in aspnuke 2.0.4 Classic ASP 0
A crea blocchi asp nuke 2.0.4 Classic ASP 0
G Finestra di dialogo che non si apre - programma NUENDO Windows e Software 0
L php mysql non salva solo id PHP 21
D Pagina non trovata Wordpress WordPress 7
S connesso, internet non disponibile ( con extebder tp-link850) Reti LAN e Wireless 0
F Script java elenco alfabetico non funziona Javascript 3
F Script non funzionante. Devo elencare in ordine alfabetico un elenco di nominativi, ma lo script non Javascript 2
L Estrazione dati casuali non doppioni MySQL 1
napuleone non si chiude il thead e non si apre il tbody Javascript 0
napuleone non si aggiorna textarea in tempo reale Javascript 3
D Modem Asus non trasmette ogni 3/4 giorni Reti LAN e Wireless 2
M non static method cannot be referenced from a static context Java 1
napuleone Con le date il codice da di matto o forse non è così Javascript 6
M Questa pagina non carica correttamente Google Maps: aiuto!! HTML e CSS 1
M "Internet non disponibile" Reti LAN e Wireless 0
L Non vedo pc in rete Reti LAN e Wireless 0
M Numero random non ripetitivo Java 2
G pc desktop non si connette all'hotspot wifi Reti LAN e Wireless 0
L Non riesco a riprodurre uno sfondo Photoshop 0
N Server mysql non raggiungibile da connessione esterna MySQL 1
R Select concatenata che non funziona la seconda volta Ajax 3
L non duplicare dati in stato "aggiornamento" PHP 6
R [Visual Studio Community] Non trovo il Progetto di Setup .NET Framework 0
zorro file PDF non visualizzo niente PHP 9
D modificare questo codice per inserimento in text e non in tabella jQuery 1
A variabile non riconosciuta PHP 0
A Copertura: indicizzata, non inviata nella mappa del sito XML 1
A funzione iconv () non mi funziona PHP 4
D File pdf che non si aprono .... PHP 1

Discussioni simili