ver igual pc que movil

[priamo]

Buenos dias, tengo un problema que no doy en como solucionarlo:
Resulta que em el pc veo la parte superior de las barras (logo,slider,menu..) a lo largo de la pantalla del pc y tablet pero en el movil se me recortan (barra del logo (div=barralogo) que tiene como fondo de la barra una imagen y tambien se recorta el slider) (div="TB_Wrapper")

os dejo el codigo por si lo necesitais:

[JSFIDDLE="<div id="gruposuperior">
<div id="barrasuperior">
<div id="barrasuperior2"><a href="file:///H|/josemanuel/index.html">
<div id="logouniversitat"></div></a>
<div class="texto1" id="idioma1"><a href="file:///H|/josemanuel/indexvalencia.html" class="texto2">Valencià</a></div>
<div class="texto1" id="idioma2"><a href="file:///H|/josemanuel/indexingles.html" class="texto2">English</a></div>
</div>
</div>

<div id="barralogo">
<div id="barralogo2">
<a href="file:///H|/josemanuel/index.html"><div class="texto2" id="logo"></div></a>
</div>
</div>

<div id="barralargamenu">
<div id="menu">
<ul>
<li class="nivel1"><a href="file:///H|/josemanuel/index.html" class="trigger">INICIO</a>
</li>

<li class="nivel1"><a href="#" class="nivel1">PERSONAS</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 3<table class="falsa"><tr><td><![endif]-->
<ul class="nivel2">
<li><a href="file:///H|/josemanuel/direccion.html">Dirección</a></li>
<li><a href="file:///H|/josemanuel/miembros.html">Miembros</a></li>
<li><a href="file:///H|/josemanuel/colaboradores.html">Colaboradores</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>

<li class="nivel1"><a href="#" class="nivel1">INVESTIGACION</a>
<!--[if lte IE 6]><a href="#" class="nivel1ie">Opción 2<table class="falsa"><tr><td><![endif]-->
<ul class="nivel2">
<li><a href="file:///H|/josemanuel/lineas.html">Lineas de Investigación</a></li>
<li><a href="file:///H|/josemanuel/publicaciones.html">Publicaciones</a></li>
<li class="nivel2"><a class="nivel2" href="#">Proyectos&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&n bsp;&nbsp;&nbsp;&nbsp;&nbsp; »</a>
<!--[if lte IE 6]><a href="#" class="nivel2ie">Opción 2.3 »<table class="falsa"><tr><td><![endif]-->
<ul class="nivel3">
<li><a class="primera" href="file:///H|/josemanuel/generales2015.html">Generales de 2015</a> </li>

</ul>
</ul>
</li>

<li class="nivel1"><a href="file:///H|/josemanuel/base.html" class="nivel1">BASE ELECTORAL</a>
</li>
<li class="nivel1"><a href="file:///H|/josemanuel/contacto.html" class="nivel1">CONTACTO</a>
</li>
</ul>
</div>
</div>

<div class="TB_Wrapper">
<div class="Slides">
<div class="Slide"><img src="file:///H|/josemanuel/Imagenes/logos fotos_ slider_univ/Slider/Slider1_1.jpg" />
</div>

<div class="Slide"><img src="file:///H|/josemanuel/Imagenes/logos fotos_ slider_univ/Slider/Depositphotos_26475129_l-2015.jpg" alt="img1" />
</div>

<div class="Slide"><img src="file:///H|/josemanuel/Imagenes/logos fotos_ slider_univ/Slider/1100Depositphotos_26207857_l-2015.jpg"alt="img1" />

</div>


</div>
</div>

<div id="barraslider"></div>
</div>"][/JSFIDDLE]

Entendiendo que debe solucionarse con algun width del codifo pero no logro dar con la tecla.
saludos

[xfxstudios]

ese codigo no ayuda si no colocas el css, que es el cual en realidad controla eso

[priamo]

Adjunto el css que faltaba

Código HTML:

<style type="text/css">
@import url("CSS/menuCSS_araudinet.css");
 
body {
    height: auto;
    margin: 0px;
    padding: 0px;
    color: #D2D2D2;
}
#contenedor {
    position: relative;
    /* [disabled]margin: auto; */
    /* [disabled]width: 1980px; */
    height: 110px;
    margin-left: auto;
    margin-right: auto;
}
#gruposuperior {
    position: relative;
    /* [disabled]margin: auto; */
    /* [disabled]width: 1980px; */
    height: auto;
    margin-left: auto;
    margin-right: auto;
}
#barrasuperior {
    width: auto;
    height: 60px;
    background-color: #454545;
}
#barrasuperior2 {
    position: relative;
    width: 1024px;
    height: 60px;
    z-index: 1;
    background-color: #;
    margin-left: auto;
    margin-right: auto;
    background-color: #454545;
}
#logouniversitat {
    position: absolute;
    width: 188px;
    height: 62px;
    z-index: 1;
    float: left;
    left: 31px;
    background-image: url(Imagenes/logos%20%20fotos_%20slider_univ/Logos/logo-uv200x66.png);
    top: -3px;
}
#idioma1 {
    position: absolute;
    width: 60px;
    height: 26px;
    z-index: 1;
    float: left;
    left: 785px;
    top: 27px;
}
#contenedor #gruposuperior #barrasuperior #barrasuperior2 #idioma1 .texto2:hover {
    color: #FFF;
}
#idioma2 {
    position: absolute;
    width: 60px;
    height: 26px;
    z-index: 1;
    float: left;
    left: 859px;
    top: 27px;
}
#contenedor #gruposuperior #barrasuperior #barrasuperior2 #idioma2 .texto2:hover {
    color: #FFF;
}
#barralogo {
    width: auto;
    height: 130px;
    border-top: 3px solid #cbc0a0;
    background-image: url(Imagenes/logos%20%20fotos_%20slider_univ/Logos/fondobarralogoazul.jpg);
}
#barralogo2 {
    position: relative;
    width: 1024px;
    height: 125px;
    z-index: 1;
    background-color: #;
    margin-left: auto;
    margin-right: auto;
    top: 2px;
}
#logo{
    position: absolute;
    width: 538px;
    height: 118px;
    z-index: 1;
    float: left;
    left: 0px;
    background-image: url(Imagenes/logos%20%20fotos_%20slider_univ/Logos/logos%20Grupo/logo_web.png);
    top: 0px;
}
#barralargamenu {
    width: auto;
    height: 48px;
    background-color: #454545;
}
#barraslider {
    position: absolute;
    width: 100%;
    height: 50px;
    background-size: 100%;
    background-image: url(Imagenes/sombras%20flechas/sombra%20top3.png);
}
 
#contenido {
    position: relative;
    width: 1024px;
    height: 850px;
    border-left: px solid #000;
    border-right: px solid #000;
    border-top: px solid #000;
    border-bottom: px solid #000;
    margin-left: auto;
    margin-right: auto;
}
/* ........................BIENVENIDOS..........................*/
 
#bienvenidos {
    position: relative;
    width: 1024px;
    height: 770px;
    margin-left: auto;
    margin-right: auto;
    z-index: 1;
    top: 50px;
    visibility: visible;
}
#fotocontenido {
    position: absolute;
    width: 260px;
    height: 749px;
    z-index: 1;
    float: left;
    left: 1px;
    top: 0px;
    background-image: url(Imagenes/logos%20%20fotos_%20slider_univ/Logos/logitonaranja.jpg);
    border: 1px solid #cccccc;
}
#organizacion {
    position: absolute;
    width: 256px;
    height: 25px;
    z-index: 1;
    float: left;
    left: 313px;
    top: 13px;
    background-color: #09F;
    padding: 10px;
}
#linea1 {
    position: absolute;
    width: 433px;
    height: 1px;
    z-index: 3;
    left: 589px;
    top: 34px;
    background-color: #0075D3;
}
#linea2 {
    position: absolute;
    width: 433px;
    height: 1px;
    z-index: 3;
    left: 589px;
    top: 38px;
    background-color: #0075D3;
}
#bienve2 {
    position: absolute;
    width: 665px;
    height: 642px;
    z-index: 1;
    float: left;
    left: 313px;
    top: 74px;
    background-color: #F1F3F2;
}
#pie {
    position: relative;
    width: 1024px;
    height: 250px;
    margin-left: auto;
    margin-right: auto;
    border-top: 4px double #cdcdcd;
    top: 10px;
}
#grupologopie {
    position: absolute;
    width: 155px;
    height: 75px;
    z-index: 1;
    left: -6px;
    top: 10px;
    border-right: 1px solid #cdcdcd;
}
#pielogo {
    position: absolute;
    width: 130px;
    height: 44px;
    z-index: 1;
    left: 17px;
    top: 11px;
}
#piecopyright {
    position: absolute;
    width: 252px;
    height: 90px;
    z-index: 1;
    left: 165px;
    top: 10px;
    border-right: 1px solid #cdcdcd;
}
#textopiecopyright {
    position: absolute;
    width: 232px;
    height: 20px;
    z-index: 1;
    left: 10px;
    top: 5px;
}
#commons {
    width: 89px;
    position: absolute;
    left: 71px;
    height: 31px;
    top: 50px;
}
#piecontacto {
    position: absolute;
    width: 340px;
    height: 114px;
    z-index: 1;
    left: 436px;
    top: 10px;
}
#mapapie {
    position: absolute;
    width: 130px;
    height: 102px;
    z-index: 1;
    float: left;
    left: 4px;
    top: 0px;
}
#senyal {
    position: absolute;
    width: 11px;
    height: 31px;
    z-index: 1;
    float: left;
    left: 147px;
    top: 7px;
    background-image: url(Imagenes/Pie/chincheta_mapa_12x30.png);
}
#textopiecontacto {
    position: absolute;
    width: 172px;
    height: 73px;
    z-index: 1;
    left: 166px;
    top: 6px;
}
#piestaf {
    position: absolute;
    width: 235px;
    height: 166px;
    z-index: 1;
    left: 783px;
    top: 10px;
    border-left: 1px solid #cdcdcd;
}
#textopiecontacto2 {
    position: absolute;
    width: 221px;
    height: 85px;
    z-index: 1;
    left: 14px;
    top: 4px;
}
#pietelefono {
    position: absolute;
    width: 16px;
    height: 18px;
    z-index: 1;
    top: 96px;
    left: 15px;
}
#textopietelefono {
    position: absolute;
    width: 133px;
    height: 20px;
    z-index: 1;
    left: 39px;
    top: 95px;
}
#piefax {
    position: absolute;
    width: 19px;
    height: 21px;
    z-index: 1;
    top: 120px;
    left: 15px;
}
#textopiefax {
    position: absolute;
    width: 134px;
    height: 20px;
    z-index: 1;
    left: 39px;
    top: 120px;
}
#piemail {
    position: absolute;
    width: 16px;
    height: 12px;
    z-index: 1;
    left: 15px;
    top: 146px;
}
#textopiemail {
    position: absolute;
    width: 143px;
    height: 20px;
    z-index: 1;
    left: 39px;
    top: 145px;
}
#contenedor #pie #piestaf #textopiemail a:hover {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 14px;
    color: #f58126;
    top: 145px;
}
 
#piefinal2 {
    position: absolute;
    width: 585px;
    height: 23px;
    z-index: 1;
    left: 260px;
    top: 200px;
}
#IrArriba {
position: fixed;
bottom: 30px; /* Distancia desde abajo */
right: 30px; /* Distancia desde la derecha */
}
 
#IrArriba span {
width: 60px; /* Ancho del botón */
height: 60px; /* Alto del botón */
display: block;
background: url(https://dl.dropboxusercontent.com/u/6084674/josemanuel/go-top%20azul.png
) no-repeat center center;
}
#IrArriba span:hover {
    width: 60px; /* Ancho del botón */
    height: 60px; /* Alto del botón */
    display: block;
}
.texto1 {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    color: #d7d7d7;
    font-weight: normal;
}
.texto2 {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    color: #d7d7d7;
    font-weight: normal;
    text-decoration: none;
}
.texto3 {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 24px;
    color: #FFFFFF;
    font-weight: normal;
}
.texto4 {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 16px;
    color: #333333;
    font-weight: normal;
    line-height: 20px;
    padding: 20px;
    text-align: justify;
}
.texto5 {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 14px;
    color: #999999;
    text-decoration: none;
}
.texto7 {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 14px;
    color: #0075D3;
    font-weight: bold;
}
.pie {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 11px;
    color: #999;
    text-decoration: none;
}
 
a:link {
    text-decoration: none;
}
a:visited {
    text-decoration: none;
}
a:hover {
    text-decoration: none;
    color: #F58126;
}
a:active {
    text-decoration: none;
}
#websfavoritas {
    position: relative;
    width: 1024px;
    height: 150px;
    left: 0px;
    top: 90px;
    border-top: 2px solid #0075D3;
}
#textowebfavoritas {
    position: absolute;
    width: 150px;
    height: 20px;
    top: 5px;
    left: 8px;
}
.textofavoritas {
    font-family: "Gotham Book";
    font-size: 14px;
    color: #0075D3;
}
</style>
 

[DesgraciadoGabo]

La verdad es que leer e interpretar todo tu código es complicado, lo más sencillo y que veo de rápido es que no estas orientando tu sitio a que se ajuste, la razón por la que lo ves bien en la tablet y en el pc es que son resoluciones mayores a los 1024px...

En tu código está esta linea:

Código CSS:

#barrasuperior2 {
    position: relative;
    width: 1024px; /*Este es el valor que te está generando problemas */
    ....
}
 

Este es el id que te esta dando problemas, cuando una pantalla es menor a los 1024 el menú y el sitio rebasará el ancho del dispositivo, te recomiendo que empieces a leer sobre los breakpoints en css, diseño responsivo, los media queries, estos te ayudarán a solucionar tu problema con la visualización de tu sitio en dispositivos moviles.

Ya por ultimo, es muy difícil que puedas ver igual tu sitio web igual en todos los dispositivos, tienen que ajustarse a la pantalla del celular y otros dispositivos, tu sitio debe ajustarse a los dispositivos, saludos!!

[xfxstudios]

Leete este TEMA ya que necesitas implementar las media querys de css para indicarle al navegador del dispoisitivo como va a organizar los elementos de acuerdo a la resolcuion

[priamo]

Muchas gracias lo leere, parece una pagina muy interesante

[priamo]

He solucionado la vision en el movil cambiando:
div contenedor 1980px por 1900px
Ahora lo veo en Movil-PC y Tablet bien
No puedo dejaros la direccion web para que lo veais porque estoy trabajando en ella.
gracias