Salve a tutti!
Ho un enorme problema con la parte responsive del mio sito e finchè non riesco a risolvere questo problema non riuscirò ad andare avanti con il sito
Problema: ho il mio foglio html e il foglio css, nell'html ho inserito il tag
<meta name="viewport" content="width=device-width,initial-scale=1"> e fin qui ci sono.
Una volta che vado nel foglio stile e inserisco per esempio:
@media screen and (max-width: 1440px){
.container {
margin-left: 15px;
margin-right: 15px;
}
}
,per fare in modo che sotto i 1440px i margini diventino di 15px, salvo, vado nel browser, apro i miei elementi di analisi e niente... nell'analisi del css nel browser non compare nulla come se non avessi scritto niente.
Ora il punto è questo: è vero che nel css ci possono essere altri fattori che non fanno funzionare i 15px di margine, ma non è tanto che non funziona il tag è proprio che qualsiasi cosa scriva una volta analizzato l'elemento nel browser non esiste!
Ho provato anche a fare in questo modo; inserire nell'html questo: <link rel="stylesheet" media screen and (max width:1440px) href="style2.css" />
e poi in un foglio stile nuovo (style2) inserire i vari attributi. Così infatti funziona il problema è che non voglio due fogli separati ma lo voglio nello stesso foglio stile e in più in questo modo dovrei tenermi come larghezza fissa quella che ho messo nell'html quindi e se poi volessi sistemare altre cose in base ad ogni larghezza che voglio dovrei continuare ad aggiungere tag del genere nell'html e altri fogli stile??
Scusatemi se mi sono dilungata ma sono in panico e devo risolvere! spero possiate aiutarmi e spero di essere stata il più chiara possibile
GRAZIE