Autore Topic: {Risolto] Padding con Bootstrap  (Letto 716 volte)

Offline arbok

  • Esploratore
  • **
  • Post: 99
  • Sesso: Maschio
    • Mostra profilo
{Risolto] Padding con Bootstrap
« il: 26 Feb 2018, 17:22:22 »
Con Bootstrap il padding non dovrebbe essere già di default?
Ho creato un box con:
Codice: [Seleziona]

<div class="row">
   <div class="col-md-6">
      <div class="bg-danger">
         <p><span style="font-size: 12pt;">Testo Testo Testo.[br /]Testo Testo[br /]Testo</span></p>
      <>
   <>
<>
ma il testo è allineato al bordo sinistro.
Quale è il tag per definirlo?
« Ultima modifica: 28 Feb 2018, 16:56:19 da arbok »

Offline tomtomeight

  • Global Moderator
  • Fuori controllo
  • ********
  • Post: 29550
  • Sesso: Maschio
  • Gli automatismi aiutano ma non insegnano nulla.
    • Mostra profilo
    • Xataface Italia
Re:Padding con Bootstrap
« Risposta #1 il: 26 Feb 2018, 18:59:13 »
Cosa c'entra il padding con l'allineamento?
NEWS DataGrill Xataface Installer (Ver. 1.0.1) per Joomla 3.8.x - DEMO Gestione Magazzino

Offline arbok

  • Esploratore
  • **
  • Post: 99
  • Sesso: Maschio
    • Mostra profilo
Re:Padding con Bootstrap
« Risposta #2 il: 27 Feb 2018, 10:38:04 »
Cosa c'entra il padding con l'allineamento?


Non c'è il margine ed i caratteri poggiano sul bordo sinistro.

Offline tomtomeight

  • Global Moderator
  • Fuori controllo
  • ********
  • Post: 29550
  • Sesso: Maschio
  • Gli automatismi aiutano ma non insegnano nulla.
    • Mostra profilo
    • Xataface Italia
Re:Padding con Bootstrap
« Risposta #3 il: 27 Feb 2018, 10:43:53 »
Citazione
ma il testo è allineato al bordo sinistro.

Potevi specificare meglio però.
NEWS DataGrill Xataface Installer (Ver. 1.0.1) per Joomla 3.8.x - DEMO Gestione Magazzino

Offline arbok

  • Esploratore
  • **
  • Post: 99
  • Sesso: Maschio
    • Mostra profilo
Re:Padding con Bootstrap
« Risposta #4 il: 27 Feb 2018, 10:48:59 »
Potevi specificare meglio però.
Hai ragione, pensavo fosse già chiaro ed evidentemente non era così.
Resta la domanda.
Sto leggendo la documentazione di Bootstrap e di w3schools, ma non riesco a trovare il parametro che lo definisca.

Offline tomtomeight

  • Global Moderator
  • Fuori controllo
  • ********
  • Post: 29550
  • Sesso: Maschio
  • Gli automatismi aiutano ma non insegnano nulla.
    • Mostra profilo
    • Xataface Italia
Re:Padding con Bootstrap
« Risposta #5 il: 27 Feb 2018, 11:14:44 »
Puoi definirlo in <p> oppure in <span> ma è corretto usarli insieme p e span?
NEWS DataGrill Xataface Installer (Ver. 1.0.1) per Joomla 3.8.x - DEMO Gestione Magazzino

Offline arbok

  • Esploratore
  • **
  • Post: 99
  • Sesso: Maschio
    • Mostra profilo
Re:Padding con Bootstrap
« Risposta #6 il: 27 Feb 2018, 11:33:34 »
Puoi definirlo in <p> oppure in <span> ma è corretto usarli insieme p e span?


OK, ma è proprio la sintassi che non riesco a trovare. Come dicevo sopra, è il parametro che mi manca.
Cosa devo scrivere?

« Ultima modifica: 27 Feb 2018, 12:08:47 da arbok »

Offline giusebos

  • Fuori controllo
  • *
  • Post: 19598
  • Sesso: Maschio
  • Giuseppe Serbelloni Mazzanti Viendalmare
    • Mostra profilo
    • Demo iCagenda
Re:Padding con Bootstrap
« Risposta #7 il: 27 Feb 2018, 12:17:48 »

Codice: [Seleziona]

<div class="row">
   <div class="col-md-6">
      <div class="bg-danger">
         <p><span style="font-size: 12pt;">Testo Testo Testo.[br /]Testo Testo[br /]Testo</span></p>
      <>
   <>
<>



quest codice come dicono a bolzano e messo a MUZZU,
il codice in linea è una estrema ratio, ovvero un supporto una tantum da usare su un specificoarticolo, ma se tutti gli articoli devono avere la stessa forma NON ci deve essere.


la classe bg-danger identifica un box allert, indi si usa in casi eccezionali dove l'aspetto del testo deve avere una eccezione di avviso per l'utente.


Quindi deciso quale è lo scopo, ad esempio inserire un box dentro la texarea, il padding ed il margin del testo viene ereditato da quello che sono le impostazioni per il testo standard.


Metti un link alla pagina in modo da poter comprendere cosa stai cercando di ottenere, oppure cerca di darci le giuste informazioni.


per adesso stando così le info il codice corretto è questo qui sotto, anche se temo che la classe row e col-md-6 nel tuo caso siano di troppo, ma attendo più informazioni prima di esprimermi definitivamente.


Codice: [Seleziona]
<div class="row">
<div class="col-md-6">
<div class="bg-danger">
<p>Testo Testo Testo.[br /]Testo Testo[br /]Testo</p>
</d iv>
</d iv>
</d iv>


su www.icagenda.it guide e tutorial con esempi di chronoforms e chronoconnectivity

Offline Limma

  • Abituale
  • ****
  • Post: 963
  • Sesso: Maschio
    • Mostra profilo
Re:Padding con Bootstrap
« Risposta #8 il: 27 Feb 2018, 12:24:59 »
Nel frattempo ha risposto giusebos, ma lascio lo stesso quello che nel frattempo avevo scritto...  ???

A dire la verità non mi è chiarissimo il tuo problema... Comunque su come e dove applicare il "padding" puoi link rimosso.

In ogni caso la griglia di Bootstrap non applica padding di default all'interno dei div che dividono in colonne le row, ma lo applica di default tra una colonna e l'altra ed è pari a 15px sia a sinistra che a destra.
Forse questo è il tuo fraintendimento di partenza.

I contenuti all'interno dei div li devi gestire poi tu.

Vedi un micro esempio in cima a questa pagina, realizzato a partire dal tuo codicetto.

P.S. il tag
Codice: [Seleziona]
[br /] così come l'hai scritto tu nel codice che hai postato nel primo post sai che è errato, vero? La sintassi corretta e funzionante è
Codice: [Seleziona]
[br /].
« Ultima modifica: 27 Feb 2018, 18:24:41 da Limma »

Offline arbok

  • Esploratore
  • **
  • Post: 99
  • Sesso: Maschio
    • Mostra profilo
Re:Padding con Bootstrap
« Risposta #9 il: 27 Feb 2018, 16:05:35 »

Intanto grazie per le risposte.
Nel frattempo avevo già trovato la risposta padding: 15x da inserire in span.
Stavo venendo qui per scriverlo ed ho visto le vostre risposte.

Il link non c'è perché è su XAMPP e sarebbe comunque inutile perché è una pagina 404.
Il box in questione è l'alert quindi il bg-danger ci sta tutto.


Il mio problema nasce da un altro problema.
Fino ad ora i template (a pagamento) avevano già tutte le classi per la formattazione di testo, box, links, ecc.
Con la nuova versione rilasciano una sorta di page builder e tutto il resto te lo devi fare a mano in bootstrap.
Documentazione della nuova versione: Link alla home page di Bootstrap.


Per velocizzare le cose ho installato un plugin che mi gestisce degli shortcode e per le cose più particolari mi sono creato un mio CSS.
Ma per questa Custom 404 non posso usare né l'uno, né l'altro e devo scrivere direttamente il codice.
Nella documentazione di Bootstrap non avevo trovato info sul padding nel Div ed infatti Limma me lo sta confermando.
Il dubbio che bastasse il padding del CSS me lo sono fatto venire dopo. Per vedere se avevo ragione ho dovuto:

  • Scaricarmi ed installarmi il demo del template
  • Andare a cercare la pagina che presentava il box e trovare la classe che lo creava
  • Andare a cercare la classe nel file CSS.
« Ultima modifica: 27 Feb 2018, 17:19:15 da arbok »

Offline giusebos

  • Fuori controllo
  • *
  • Post: 19598
  • Sesso: Maschio
  • Giuseppe Serbelloni Mazzanti Viendalmare
    • Mostra profilo
    • Demo iCagenda
Re:Padding con Bootstrap
« Risposta #10 il: 27 Feb 2018, 16:48:20 »
ricontrolla la formattazione che non si legge una cippa.
su www.icagenda.it guide e tutorial con esempi di chronoforms e chronoconnectivity

Offline arbok

  • Esploratore
  • **
  • Post: 99
  • Sesso: Maschio
    • Mostra profilo
Re:Padding con Bootstrap
« Risposta #11 il: 27 Feb 2018, 17:18:13 »
ricontrolla la formattazione che non si legge una cippa.


Quel Size è tutto frutto del Forum, lì non ci dovrebbe essere nulla.
Funziona un po' a modo suo, basta una cancellazione e parte per la tangente
====


Invece c'era. Corretto!
(Ma la formattazione non era farina del mio sacco)

« Ultima modifica: 27 Feb 2018, 17:20:01 da arbok »

Offline giusebos

  • Fuori controllo
  • *
  • Post: 19598
  • Sesso: Maschio
  • Giuseppe Serbelloni Mazzanti Viendalmare
    • Mostra profilo
    • Demo iCagenda
Re:Padding con Bootstrap
« Risposta #12 il: 27 Feb 2018, 18:22:52 »
In questo forum quando si pubblica un post bisogna controllare la formattazione perchè spesso inserisce degli stili in linea con le istruzioni per rimpicciolire i caratteri.


Per quanto riguarda ciò che stai facendo, dovresti capire che stili in linea e stili da css creano solo confusione. Poi se ci metti che utilizzi estensioni per gli short curt viene fuori un minestrone.


Queste estensioni sono per chi non sa usare altro e non vuole capire quelle poche regoline di css.......
su www.icagenda.it guide e tutorial con esempi di chronoforms e chronoconnectivity

Offline arbok

  • Esploratore
  • **
  • Post: 99
  • Sesso: Maschio
    • Mostra profilo
Re:Padding con Bootstrap
« Risposta #13 il: 27 Feb 2018, 18:39:26 »
Per quanto riguarda ciò che stai facendo, dovresti capire che stili in linea e stili da css creano solo confusione. Poi se ci metti che utilizzi estensioni per gli short curt viene fuori un minestrone.

Queste estensioni sono per chi non sa usare altro e non vuole capire quelle poche regoline di css.......


Come dicevo, mi sono creato un CSS con un codice personalizzato da usare con JCE.
Prima usavo la formattazione del template {box opzione 1, 2 3 ed era tutto pronto.
Non mi sono dovuto neppure curare delle varie versioni CSS e Bootstrap.


Adesso invece è un casino e devo metterci le mani io.
Mi sono accorto oggi che non c'è più neppure la posizione dove inserire il menu e se voglio due menu da usarsi in due situazioni differenti dovrei cambiare il template: uno per usare un menu ed uno per l'altro.


Però, ripeto, questo post è relativo ad una pagina 404 ad hoc che mi tocca gestire attraverso il framework del template se voglio che resti l'URL della pagina errata.

Ho qui nel Forum un altro post nel quale chiedevo come passare un parametro a Joomla perché in questo caso non mi preoccuperei più del framework e visualizzerei direttamente l'URL nel corpo della pagina, anzi se possibile direttamente nel form da inviare per la segnalazione dell'errore.


Pagina errata > (URL) passato a Custom 404 > Form

 

Torna su