add box top page

fred921

Nuovo Utente
11 Mar 2020
6
0
1
vorrei aggiungere alla mia pagina html molto semplice un box al top come in questo link: https://www.miraclesalad.com/webtools/md5.php
che abbia un colore, e si adatti alla dimensione della mia pagina (variabile, ossia che si adatti a largh/altezza).
specifico che non ho un css a parte, ma lo style della pagina (poche righe) è nella pagina stessa.
cosa devo aggiungere x avere un box simile al top della mia pagina? x ora ho messo un box
h1 {
border-top: 30px solid #C1C3C3;
}
ma questo mi lascia spazi bianchi sui lati, mentre io lo vorrei in aderenza come nel link riportato sopra. grazie. saluti
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.449
338
83
Cosa vuoi farci con il box?
Solo per il testo o altro?
 

fred921

Nuovo Utente
11 Mar 2020
6
0
1
no, nessun testo. mi piacerebbe solo avere un box ad inizio pagina, con un colore. solo un fattore estetico.
un box come appunto nel link che ho citato sopra.
e solo codice, da inserire in una semplice pagina html senza css. grazie
 

fred921

Nuovo Utente
11 Mar 2020
6
0
1
però mi piacerebbe avere un box aderente, come nel link sopra. sino ad ora sono riuscito solo a mettere un <div> con un box ma si distanzia sempre un poco da alto e sui lati.... non è proprio aderente con questo:
<div style="height: 40px; background-color: #C1C3C3"></div>
 

fred921

Nuovo Utente
11 Mar 2020
6
0
1
no, non lo avevo messo il margin: 0 (come vedi da mio codice sopra)
grazie x il suggerimento, ma non serve. il risultato è sempre lo stesso, con margini. io credo che questo sia dovuto al fatto di aver applicato un valore <div>
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.449
338
83
Scusami ma io non ho ancora capito !

Vuoi un riquadro colorato attaccato al margine sinistro e al margine superiore della pagina e basta?
Se è così basta un semplice div di dimensioni a tuo piacere
 

fred921

Nuovo Utente
11 Mar 2020
6
0
1
guarda questo link https://www.neowin.net/news/cat/software
al top della pagina c'è un box blu, in aderenza ai margini (sx, top, e dx) della pagina.
io ho usato <div style="height: 40px; background-color: #C1C3C3"></div> nel codice html della mia pagina, ma questo mi lascia dei margini ai lati sinistro, alto e destra... non è aderente come invece vorrei....
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.449
338
83
Prova così:
HTML:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Documento senza titolo</title>
<style>
#box {
    position:absolute;
    top: 0;
    lesf: 0;
    margin: 0;
    height: 40px;
    width: 40px;
    background-color: #C1C3C3;
}
</style>
</head>

<body>
<div id="box"></div>
</body>
</html>

ATTENZIONE!
Quando posti del codice sei tenuto ad usare il tag appropriato come ho fatto io
 

fred921

Nuovo Utente
11 Mar 2020
6
0
1
perfetto! grazie mille! risolto.
ho però apportato alcune modifiche, che scrivo qui x chi magari fosse interessato:
intanto ho corretto il tuo lesf: 0; con left: 0; (capisco possa essere sfuggito!)
poi il width: 40px; io lo volevo x esteso alla pagina, quindi ho messo un width esagerato che mi coprisse x intero anche una alta risoluzione dello schermo, non sapendo come esprmere il massimo, quindi ho scritto width: 4000px;
poi ho rivoluzionato il tutto mettendo tutto in un <div> così lo metto dove mi serve, quindi alla fine ho usato:
HTML:
<div style="position:absolute; top: 0; left: 0; right: 0; height: 50px; background-color: #C1C3C3">
       
                    </div>
in questo modo ho un box al top aderente ai margini, esteso alla pagina intera.
grazie molte x il tuo suggerimento! saluti
 
Ultima modifica:
Discussioni simili
Autore Titolo Forum Risposte Data
J Top 10 Free Web Chat box Plug-ins and Add-ons Javascript 0
L Error Code: 1215. Cannot add foreign key constraint MySQL 3
R Come creare sistema Add to homescreen PHP 3
A Aprire la window form Add Connection da codice Visual Basic 4
R How to add text watermark direct on the HTML page? HTML e CSS 1
bubino8 [Javascript] Resize add/remove Class Javascript 1
F Add expires headers SEO e Posizionamento 3
webmachine [PRESTASHOP] Add pagamento con carte E-Commerce 1
JackIlPazzo Cannot add foreign key constraint MySQL 1
P non trovo l'add-ons HDR options che ho appena installato Photoshop 1
R pulsante "Add" Sviluppo app per Android 2
P Supporto per creare uno script "Add Cart" Offerte e Richieste di Lavoro e/o Collaborazione 7
J problema jquery add/removeclass jQuery 1
F [VENDO] Script portale annunci + svariati add-on (il più serio in circolazione) Offerte e Richieste di Lavoro e/o Collaborazione 0
H add videoplayer in php5/Mysql PHP 11
Blogmasterpg Add Money Blog Presenta il tuo Sito 0
S XXXLinkReview.com Launches ...Add your links! Presenta il tuo Sito 0
S add new Classic ASP 1
V Mailchimp - box di testo: cambia da solo il testo inserito Email Marketing 2
M Mailchimp: arrotondare bordi di box testuali Email Marketing 6
Shyson Centrare box css HTML e CSS 2
Z Conteggi BOX per ogni 5 righe PHP 1
G Box con testo casuale WordPress 1
moustache text box + post php con IE si comporta in modo strano PHP 16
W Modificare il Type di un Input box in javascript ovunque si trovi Javascript 0
F classic asp popolare combo box javascript Presentati al Forum 1
S [WordPress] Creare una select box con partita iva e codice fiscale in base a una logica. WordPress 0
P Riproduzione avi file in una picture box da file .dll .ocx ed altri in visual basic 10 express Offerte e Richieste di Lavoro e/o Collaborazione 0
spider81man [PHP] Alert Box per confermare Inserimento o Cancellazione dato. PHP 4
B [HTML] Problema main box di un template HTML e CSS 2
A [Javascript] [HTML] RISOLTO...Allungare un box all'apertura della pagina No Mouse over Javascript 9
O [HTML] form box ricerca HTML e CSS 3
felino TV Box Android: consiglio su quale acquistare Discussioni Varie 0
Matteol92 [HTML] Creare social box senza sovrapposizione HTML e CSS 5
I [HTML] Codice box testo con scrollbar sopra immagine HTML e CSS 1
S [HTML] Box immagine e testo HTML e CSS 1
F come creare un search box coi file .xml dei merchant? XML 0
S Problema drop-down box PHP 22
felino [CSS][Wordpress] Adattare delle immagini alla dimesione del box contenitore HTML e CSS 2
F Quale privacy policy menzionare in un BOX COMMENTI? Leggi, Normative e Fisco 0
D Creare un box ricerca HTML e CSS 5
G Aiuto su combo box di access MS Access 0
V problema con codice Facebook Like box Social Media Marketing 0
C Problema centraggio box div HTML e CSS 2
O Riempire una box di testo dal centro HTML e CSS 1
Akari Honoka html+css box posizione HTML e CSS 1
M allineare due box(div) affiancati HTML e CSS 19
I Login box HTML e CSS 0
G Lasciare inalterati valori campi textarea e combo box PHP 0
filomeni Show Box Supporto Mr.Webmaster 5

Discussioni simili