[RISOLTO] Creare Bordo INTERNO [CSS]

Luke Guada

Nuovo Utente
18 Set 2013
13
0
0
È possibile tramite CSS creare un bordo interno ad una div??

Mi spiego:

Se creo un div:
Codice:
<div id="div1x"> etc etc etc </div>
Ora tramite CSS faccio:
Codice:
#div1x{width:100px;}

Ok, se mi seguite ora abbiamo una div che effettivamente ha come dimensione 100px.
Ora però se vado ad aggiungere al CSS dove è il DIV:
Codice:
border: 1px black solid;

Avrò una div che invece di essere larga 100px sarà larga 102px, questo perchè sono stati aggiunti due bordi esterni (sinistra 1px, destra 1px), io vorrei far in modo che i bordi vadano all'interno cosi anche se vado ad aggiungere border:10px black solid; la/il DIV sarà sempre di 100px


Non so se mi sono spiegato... come posso risolvere??
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Non puoi semplicemente diminuire la larghezza?
Codice:
#div1x{
width:98px;
border: 1px black solid;
}
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Forse puoi ottenere il risultato con la proprietà box-sizing dei css3
prova questo esempio
HTML:
<style type="text/css">
    p#a {
        width:100px;
        height:60px;
        border:2px solid black;
    }
    p#b {    
        width:100px;
        height:60px;
        border:2px solid black; 
        -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
        -moz-box-sizing: border-box;    /* Firefox, Gecko */
        box-sizing: border-box;         /* Opera/IE 8+ */
    }
</style>
<p id="a">Paragrafo da 100px con bordo</p>
<p id="b">Paragrafo da 100px con box-sizing</p>
e dai un occhiata a questo articolo
 

Luke Guada

Nuovo Utente
18 Set 2013
13
0
0
Forse puoi ottenere il risultato con la proprietà box-sizing dei css3
prova questo esempio
HTML:
<style type="text/css">
    p#a {
        width:100px;
        height:60px;
        border:2px solid black;
    }
    p#b {    
        width:100px;
        height:60px;
        border:2px solid black; 
        -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
        -moz-box-sizing: border-box;    /* Firefox, Gecko */
        box-sizing: border-box;         /* Opera/IE 8+ */
    }
</style>
<p id="a">Paragrafo da 100px con bordo</p>
<p id="b">Paragrafo da 100px con box-sizing</p>
e dai un occhiata a questo articolo


Sembra proprio funzioni...
Più tardi faccio qualche prova sui div e faccio sapere!
 
Discussioni simili
Autore Titolo Forum Risposte Data
Zea [PHP] RISOLTO - creare link con il risultato dell'interrogazione db PHP 1
S [risolto] Creare una mappa Google per ogni indirizzo Javascript 14
felino [risolto] Creare un modulo per preventivi basato su diversi step PHP 3
Monital [RISOLTO]creare un calendario stile campionato di calcio PHP 8
L (risolto) MySQL 0
B getElementById su piu id(Risolto) Javascript 7
L Esercitarsi con Js [RISOLTO] Javascript 4
C [RISOLTO]Inserimento variabile php in input html PHP 20
L risolto visualizzazione e ordinamento dati PHP 1
moustache [RISOLTO] SQL PHP IIS PHP 8
Sergio Unia Ricezione email con destinatari multipli [Risolto] PHP 2
L update tabelle in php mysql [risolto] PHP 6
M Semplice visualizzatore di immagini [risolto con plugin wp] PHP 7
L [RISOLTO] Stampa a video risultato count in html PHP 13
L [RISOLTO] Eliminare una discussione creata PHP 3
tomorc [HTML] Problema con scroll bar (risolto) HTML e CSS 0
A [PHP] Problema query insert [RISOLTO] PHP 14
B [PHP] recuperare IP dei server in load balancing [RISOLTO] PHP 3
K [RISOLTO] Problema Griglia Php+Mysql PHP 13
S [RISOLTO] aggiorna tabella da select option asp classic Classic ASP 7
elpirata [RISOLTO][Javascript] Datapicker e autocompletamento campo input Javascript 2
elpirata [RISOLTO][Mysql] Problema insert valori apostrofati MySQL 1
elpirata [RISOLTO][Mysql] Contare le occorrenze in un campo tipo varchar MySQL 2
G [MS Access] Gestione biglietti [RISOLTO] MS Access 2
G [MS Access] Casella combinata & Query [RISOLTO] MS Access 4
G [MS Access] Query mese corrente con conteggio [RISOLTO] MS Access 2
M [RISOLTO]Windows media player non mi funziona più su win 10 pro 64 bit Windows e Software 2
C [RISOLTO][PHP] Errore di sintassi PHP 8
IT9-Gpp [RISOLTO] Leggere variabile restituita da success Ajax 3
Kolop [RISOLTO][PHP] Problema Pagination PHP 2
C [RISOLTO][PHP] Funzione ONclick PHP 14
C [RISOLTO][PHP] Conteggio righe di una tabella PHP 4
N [PHP] Utilizzo variabili di sessione [Risolto] PHP 13
Tommy03 [RISOLTO][PHP] Webserver o devserver? PHP 2
Sergio Unia Recupero dati da una vecchia versione MySql [Risolto] MySQL 4
spider81man [PHP] Problemi cancellazione dato su DB [RISOLTO] PHP 1
A [RISOLTO]Inserimento Immagini da pc a MySql PHP 15
A [PHP] RISOLTO Invio Mail con Tabella PHP 2
felino Risolto - [Wordpress][WooCommerce] PayPal Checkout e campi di fatturazione WordPress 2
elpirata [PHP][RISOLTO] Sommare gli importi estratti da un ciclo while PHP 3
elpirata [PHP][RISOLTO] Effettuare la somma dei tempi di lavorazione PHP 3
elpirata [PHP] [RISOLTO]Sovrascrivere testo in una tabella PHP 2
A [RISOLTO]Recuperare dati inviati con json tramite php PHP 4
C [RISOLTO][PHP] Passaggio variabili senza refresh di pagina PHP 7
elpirata [PHP][RISOLTO] Errore di tipo Notice: Undefined index - Come risolvere quando si hanno tante var PHP 10
S Problema in PHP per invio file XML - RISOLTO- PHP 8
A [Javascript] [RISOLTO] Doppio "submit", in uno stesso "Form" , che puntino ad "action" diversi Javascript 1
marino51 [Risolto]videochat di messenger ha smesso di funzionare sul telefonino Smartphone e tablet 1
A [Javascript] [HTML] RISOLTO...Allungare un box all'apertura della pagina No Mouse over Javascript 9
ken_korn [Javascript][Risolto] browser.tab.Tabs.favIconUrl non funziona Javascript 5

Discussioni simili