Jump to content

(Solucionado) ñadido fondo de imagen en página en construccion no se ve la imagen en dispositivos


nacaer

Recommended Posts

buenas tardes,

He puesto una magen en pagina en mantenimiento y no se ve en los dispositivos moviles, me podeis decir el motivo?

 

la web es www.codigoartistico.com

 

gracias de antemano,

 

buenas tardes,

He puesto una magen en pagina en mantenimiento y no se ve en los dispositivos moviles, me podeis decir el motivo?

 

la web es www.codigoartistico.com

 

gracias de antemano,

maintenance.css

Edited by nacaer (see edit history)
Link to comment
Share on other sites

Por ejemplo así:
 

#maintenance {
  margin: 50px 0 0 0; 
 background: url(../img/bg_maintenance.png) no-repeat;
}
  @media (min-width: 1200px) {
    #maintenance {
      margin: 126px 0 0 0;
      padding: 91px 48px 365px 297px;
      background: url(../img/bg_maintenance.png) no-repeat; } }
  #maintenance .logo {
    margin: 0 0 31px 0; }
  #maintenance h1 {
    font: 600 28px/34px "Open Sans", sans-serif;
    color: #333333;
    text-transform: uppercase;
    border-bottom: 1px solid #d6d4d4;
    padding: 0 0 14px 0;
    margin: 0 0 19px 0; }
  #maintenance #message {
    font: 600 16px/31px "Open Sans", sans-serif;
    padding: 0 0 0 18px;
    color: #555454;
    text-transform: uppercase; }

.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto; }

@media (min-width: 768px) {
  .container {
    width: 750px; } }
@media (min-width: 992px) {
  .container {
    width: 970px; } }
@media (min-width: 1200px) {
  .container {
    width: 1170px; } }
@media only screen and (min-width: 1200px) {
  .container {
    padding-left: 0;
    padding-right: 0; } }
Link to comment
Share on other sites

 

Por ejemplo así:

 

#maintenance {
  margin: 50px 0 0 0; 
 background: url(../img/bg_maintenance.png) no-repeat;
}
  @media (min-width: 1200px) {
    #maintenance {
      margin: 126px 0 0 0;
      padding: 91px 48px 365px 297px;
      background: url(../img/bg_maintenance.png) no-repeat; } }
  #maintenance .logo {
    margin: 0 0 31px 0; }
  #maintenance h1 {
    font: 600 28px/34px "Open Sans", sans-serif;
    color: #333333;
    text-transform: uppercase;
    border-bottom: 1px solid #d6d4d4;
    padding: 0 0 14px 0;
    margin: 0 0 19px 0; }
  #maintenance #message {
    font: 600 16px/31px "Open Sans", sans-serif;
    padding: 0 0 0 18px;
    color: #555454;
    text-transform: uppercase; }

.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto; }

@media (min-width: 768px) {
  .container {
    width: 750px; } }
@media (min-width: 992px) {
  .container {
    width: 970px; } }
@media (min-width: 1200px) {
  .container {
    width: 1170px; } }
@media only screen and (min-width: 1200px) {
  .container {
    padding-left: 0;
    padding-right: 0; } }

muchas gracias

voy a probar

Link to comment
Share on other sites

muchas gracias

voy a probar

 

 

Por ejemplo así:

 

#maintenance {
  margin: 50px 0 0 0; 
 background: url(../img/bg_maintenance.png) no-repeat;
}
  @media (min-width: 1200px) {
    #maintenance {
      margin: 126px 0 0 0;
      padding: 91px 48px 365px 297px;
      background: url(../img/bg_maintenance.png) no-repeat; } }
  #maintenance .logo {
    margin: 0 0 31px 0; }
  #maintenance h1 {
    font: 600 28px/34px "Open Sans", sans-serif;
    color: #333333;
    text-transform: uppercase;
    border-bottom: 1px solid #d6d4d4;
    padding: 0 0 14px 0;
    margin: 0 0 19px 0; }
  #maintenance #message {
    font: 600 16px/31px "Open Sans", sans-serif;
    padding: 0 0 0 18px;
    color: #555454;
    text-transform: uppercase; }

.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto; }

@media (min-width: 768px) {
  .container {
    width: 750px; } }
@media (min-width: 992px) {
  .container {
    width: 970px; } }
@media (min-width: 1200px) {
  .container {
    width: 1170px; } }
@media only screen and (min-width: 1200px) {
  .container {
    padding-left: 0;
    padding-right: 0; } }

sigo sin verlo en los dispositivos

Link to comment
Share on other sites

Así: (No te estaba leyendo las medidas del fondo, por eso ahora no te lo mostraba)

#maintenance {
margin: 50px 0 0 0;
background: url(../img/bg_maintenance.png) no-repeat;
height: 963px;
background-position: center center;
-o-background-size: 100% 100%, auto;
-moz-background-size: 100% 100%, auto;
-webkit-background-size: 100% 100%, auto;
background-size: 100% 100%, auto;
}
  @media (min-width: 1200px) {
    #maintenance {
      margin: 126px 0 0 0;
      padding: 91px 48px 365px 297px;
      background: url(../img/bg_maintenance.png) no-repeat; } }
  #maintenance .logo {
    margin: 0 0 31px 0; }
  #maintenance h1 {
    font: 600 28px/34px "Open Sans", sans-serif;
    color: #333333;
    text-transform: uppercase;
    border-bottom: 1px solid #d6d4d4;
    padding: 0 0 14px 0;
    margin: 0 0 19px 0; }
  #maintenance #message {
    font: 600 16px/31px "Open Sans", sans-serif;
    padding: 0 0 0 18px;
    color: #555454;
    text-transform: uppercase; }

.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto; }

@media (min-width: 768px) {
  .container {
    width: 750px; } }
@media (min-width: 992px) {
  .container {
    width: 970px; } }
@media (min-width: 1200px) {
  .container {
    width: 1170px; } }
@media only screen and (min-width: 1200px) {
  .container {
    padding-left: 0;
    padding-right: 0; } }
Edited by nadie (see edit history)
  • Like 1
Link to comment
Share on other sites

Así: (No te estaba leyendo las medidas del fondo, por eso ahora no te lo mostraba)

#maintenance {
margin: 50px 0 0 0;
background: url(../img/bg_maintenance.png) no-repeat;
height: 963px;
background-position: center center;
-o-background-size: 100% 100%, auto;
-moz-background-size: 100% 100%, auto;
-webkit-background-size: 100% 100%, auto;
background-size: 100% 100%, auto;
}
  @media (min-width: 1200px) {
    #maintenance {
      margin: 126px 0 0 0;
      padding: 91px 48px 365px 297px;
      background: url(../img/bg_maintenance.png) no-repeat; } }
  #maintenance .logo {
    margin: 0 0 31px 0; }
  #maintenance h1 {
    font: 600 28px/34px "Open Sans", sans-serif;
    color: #333333;
    text-transform: uppercase;
    border-bottom: 1px solid #d6d4d4;
    padding: 0 0 14px 0;
    margin: 0 0 19px 0; }
  #maintenance #message {
    font: 600 16px/31px "Open Sans", sans-serif;
    padding: 0 0 0 18px;
    color: #555454;
    text-transform: uppercase; }

.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto; }

@media (min-width: 768px) {
  .container {
    width: 750px; } }
@media (min-width: 992px) {
  .container {
    width: 970px; } }
@media (min-width: 1200px) {
  .container {
    width: 1170px; } }
@media only screen and (min-width: 1200px) {
  .container {
    padding-left: 0;
    padding-right: 0; } }

muchas gracias NADIE, acabo de entender el problema.

Un abrazo

Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
×
×
  • Create New...