Al ver mi web en Windows se descoloca todo!

Jacko · 26 Nov 2012, 16:45 · Solicitar retirada

Buenas, he creado un Theme para el tumblr. El caso es que en Mac, me va perfecto, todo se me ubica genial, va perfecto... Pero al verlo en windows se me descoloca el fondo con el contenido, y claro, queda feo.

Os dejo un ejemplo:
[contenido no disponible]

Como veis a la izq (MAC) se ve el borde gris al rededor de las fotos y a la izq, el cuadro blanco queda uniforme, en el pc de la der(WINDOW), se ve todo mal.

Que puedo hacer? Mil gracias!

Pongo por si acaso el codigo:

<!DOCTYPE>

<script language="JavaScript1.2">

</script>
<script type="text/javascript" language="javascript1.2">
function comprobarScreen()
{ if(window.screen.availWidth <= 640)
{window.parent.document.body.style.zoom="50%";}
if(window.screen.availWidth == 800)
{window.parent.document.body.style.zoom="65%";}
if(window.screen.availWidth == 1024)
{window.parent.document.body.style.zoom="90%";}
if(window.screen.availWidth == 1280)
{window.parent.document.body.style.zoom="90%";}
if(window.screen.availWidth >= 1366)
{window.parent.document.body.style.zoom="95%";}
if(window.screen.availWidth >= 1400)
{window.parent.document.body.style.zoom="100%";}
}
</script>
<body onload="comprobarScreen()">

<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=820" />
<meta name="color:background" content="#ffffff"/>
<meta name="color:center" content="#ffffff"/>
<meta name="color:title" content="#000000"/>
<meta name="color:text" content="#acacac"/>
<meta name="color:Description" content="#acacac"/>
<meta name="color:link" content="#000000"/>
<meta name="color:hover" content="#DFDFDF"/>
<meta name="color:border" content="#fff"/>
<meta name="color:permalink" content="#00e0FF"/>
<meta name="color:permalink background" content="#000000"/>

<meta name="image:background" content="" />
<meta name="image:sidebar" content="" />

<meta name="if:infinite scrolling" content="1"/>
<meta name="if:show random" content="1"/>
<meta name="if:show archive" content="1"/>
<meta name="if:show reblog link" content="1"/>
<meta name="if:show caption" content="0"/>

<meta name="text:Ask Title" content="" />
<meta name="text:previous page title" content="Previous page"/>
<meta name="text:next page title" content="Next page"/>
<meta name="text:Link One" content="" />
<meta name="text:Link One Title" content="" />
<meta name="text:Link Two" content="" />
<meta name="text:Link Two Title" content="" />
<meta name="text:Link Three" content="" />
<meta name="text:Link Three Title" content="" />
<meta name="text:Link Four" content="" />
<meta name="text:Link Four Title" content="" />

<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
<title>{block:SearchPage}Search results for "{SearchQuery}" - {/block:SearchPage}{block:PostSummary}
{PostSummary} - {/block:PostSummary}{Title}</title>
{block:ifinfinitescrolling}
<script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>{/block:ifinfinitescrolling}<script type="text/javascript" src=""></script>

<style type="text/css"> body { margin-top:0px; background-color:{color:background}; background-image:url({image:Background}); background-attachment: fixed; background-position:top left; background-repeat: repeat; font-family: tahoma, helvetica; font-size: 10px; line-height:11px; color: {color:text};} p {margin:0px; margin-top:5px;} a {text-decoration: none; color: {color:Link}; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; transition: all 0.5s ease-out;} a:hover{ text-decoration: none; color: {color:Hover}; -webkit-transition: all 0.1s ease-out; -moz-transition: all 0.1s ease-out; transition: all 0.1s ease-out;} a:active{outline: none;} a:focus{-moz-outline-style: none;} :-moz-any-link:focus{outline: none;} strong{font-weight: bold; color:#000;} b{font-weight: bold;} img{border:none;} div#center a:hover{padding: 5px} .permalink{ position:absolute; float:right; margin:10px 0px 25px 0px; text-align:center; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-out; transition: all 0.5s ease-out;} .permalink a{color:{color:Link};} .permalink a:hover{color:{color:Hover};} div#center{ padding: 5px; width:500px; margin-top: 25px; background: {color:center};} div#entry-deux{ width:500px; border-bottom :1px solid {color:border}; margin-bottom: 15px;} div#content{ margin: 0px auto 0px; width:500px; padding: 5px; padding-bottom: 0px; padding-left: 0px} div.sidebar { position:fixed; margin-left: 520px; margin-top: 40px; padding: 5px; padding-bottom: 10px; z-index: 1000; width: 200px; height: auto; background-color: {color:center}; border-bottom :1px solid {color:border}; color: {color:text}; color-link: {color:link};} .sidebarlink { color: {color:link}; cursor:pointer; margin-left: 0px; letter-spacing: 0.3px; position:relative; font-style:normal; text-align: left; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; transition: all 0.5s ease-out;} .sidebarlink a:hover { padding-left: 50px; color: {color:hover} -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; transition: all 0.3s ease-out;} #postnotes{text-align: justify;} #postnotes blockquote{border: 0px;} .title{text-transform:uppercase; text-align:left; font-size:14px; line-height: 14px; letter-spacing:1px; color:{color:title};} .title2{text-transform:uppercase; margin-top: -10px; font-size:12px; letter-spacing:1px; color:{color:title};} blockquote{padding:0px 0px 2px 5px; margin:0px 0px 2px 1px;} blockquote p, ul{margin:0px; padding:0px; } ul, ol, li{list-style:none; margin:0px; padding:0px;} .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label, .user_7 .label, .user_8 .label, .user_9 .label {color:#969696;} div#entry-deux .permalink1{margin-bottom:0px; width:500px; height: 0px; padding-top: 5px; margin-top: -10px; position:absolute; background-color:{color:permalink background}; color:{color:permalink}; overflow:hidden; font-size:10px; text-align:center; letter-spacing:0.6px; line-height:20px; white-space:nowrap; opacity: 0.0; -webkit-transition: all .5s linear; -moz-transition: all .5s linear; transition: all 0.5s linear;} div#entry-deux .permalink1 a{color:{color:permalink};} div#entry-deux .permalink1 a:hover{ color:{color:permalink}; opacity: 0.6; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; transition: all 0.3s linear;} div#entry-deux:hover .permalink1{ width: 500px; height: 25px; padding-bottom: 50%; overflow:visible; -webkit-transition: opacity 0.7s linear; opacity: 0.8; -webkit-transition: all .2s linear; -moz-transition: all .2s linear; transition: all 0.2s linear;} .search2{color: #000; padding-top:3px; padding-bottom:3px; cursor:pointer; margin: 0px; line-height: 18px; letter-spacing: 0.3px; position:relative; font-weight:bold; width: 190px; margin-top: -2px; border: 0px!important; text-transform:uppercase; text-align:center; -webkit-transition: all 1s ease-out; -moz-transition: all 1s ease-out; transition: all 1s ease-out;} .search2:hover {color: #fff; background-color:#000; -webkit-transition: all 0.1s ease-out; -moz-transition: all 0.1s ease-out; transition: all 0.1s ease-out;} .search {color: {color:link}; cursor:pointer; margin-left: 0px; letter-spacing: 0.3px; position:relative; font-style:normal; text-align: left; margin-left: -1px; margin-top: -1px; border: 0px!important; padding: 0px 0px; background-color: {color:center}; cursor:text; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; transition: all 0.5s ease-out;} .search:hover {padding-left: 0px; color: {color:hover} -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; transition: all 0.3s ease-out;} div.padd { width: 100%; line-height: 11px; padding-top: 0px; padding-left: 5px; margin: 0px;} #answer{ margin-top: 10px; margin-left: -34px;} {CustomCSS} </style>
</head>

<body>
<div id="content">
<div class="sidebar">
{block:IfSidebarImage}
<img src="{image:Sidebar}" width=200px/><br><br>
<a href="/" class="title2"><center>{title}</center></a><br>
{/block:IfSidebarImage}

{block:IfNotSidebarImage}
<img src="http://25.media.tumblr.com/tumblr_me3barx44d1rm39yqo1_1280.jpg" width='200px' align="center">
<br> <br>
<div style="margin-left: 50px;"><a href="/" class="title2">{title}</a></div>
{/block:IfNotSidebarImage}

{block:IfNotSidebarImage}
<div style="margin-top: 6px;">
{/block:IfNotSidebarImage}

<div style="color: {color:Description};">{description}</div><br>

<div class="sidebarlink">
{block:ifLinkOneTitle}
<a href="{text:Link One}">{text:Link One Title}</a><br>
{/block:ifLinkOneTitle}

{block:ifLinkTwoTitle}
<a href="{text:Link Two}" class="nav_head">{text:Link Two Title}</a><br>
{/block:ifLinkTwoTitle}

{block:ifLinkThreeTitle}
<a href="{text:Link Three}">{text:Link Three Title}</a><br>
{/block:ifLinkThreeTitle}

{block:ifLinkFourTitle}
<a href="{text:Link Four}">{text:Link Four Title}</a><br>
{/block:ifLinkFourTitle}

{block:AskEnabled}<a href="/ask">{block:ifasktitle}{text:Ask Title}{/block:ifasktitle}{block:ifnotasktitle}{AskLabel}{/block:ifnotasktitle}</a><br>{/block:AskEnabled}

{block:ifshowrandom}<a href="/random">Random</a><br>{/block:ifshowrandom}
{block:ifshowarchive}<a href="/archive">Archive</a><br>{/block:ifshowarchive}

{block:HasPages}{block:Pages}
<a href="{URL}">{Label}</a>
{/block:Pages}{/block:HasPages}

</div><br><br>

{block:IfNotSidebarImage}</div>{/block:IfNotSidebarImage}

{block:ifinfinitescrolling}
<div style="margin-top: 50px; text-align:center;">
</a>.
</div>
{/block:ifinfinitescrolling}
{block:ifNOTinfinitescrolling}
<div style="margin-top: 50px; text-align:center;">
{block:Pagination}
{block:PreviousPage}
<a href="{PreviousPage}">{text:previous page title}**</a>
{/block:PreviousPage}
{block:JumpPagination length="5"}
{block:CurrentPage}
<span class="current_page">{PageNumber}</span>
{/block:CurrentPage}
{block:JumpPage}
<a class="jump_page" href="{URL}">{PageNumber}</a>
{/block:JumpPage}
{/block:JumpPagination}
{block:NextPage}
<a href="{NextPage}">**{text:next page title}</a>
{/block:NextPage}
{/block:Pagination}<br>
</div>
{/block:ifNOTinfinitescrolling}
</center>
</div>

<div id="center">
{block:Posts}

<div id="entry-deux">
{block:IndexPage}
<div class="permalink">
<span class="permalink1">
{block:Date}
{block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>
<a>**|**</a>{/block:NoteCount}
<a href="{Permalink}">{DayOfMonth}/{MonthNumber}/{ShortYear}</a>
<a>**|**</a>
<a href="{Permalink}">{12Hour}:{Minutes}{AmPm}</a>
{block:ifshowrebloglink}<a>**|**</a><a href="{ReblogURL}" target="_blank">Reblog
</a>{/block:ifshowrebloglink}
{/block:Date}
</span></div>
{/block:IndexPage}

{block:Text}
{block:Title}<span class="title">{Title}</span>{/block:Title}
<span class="entrytext">{Body}</span>
{/block:Text}

{block:Link}
<a href="{URL}" class="title">{Name}</a>
{block:Description}{Description}{/block:Description}
{block:Link}

{block:Answer}
<table width="100%" border="0px" cellpadding="0" cellspacing="0">
<tbody style="border-spacing: 0px;">
<td width="30px" style="vertical-align: top; width: 30px; padding: 0px;">
<img height="30px" width="30px" style="padding: 0px; margin: 0px;" src="{AskerPortraitURL-30}"/></td><td>
<div class="padd" width="100%" style="margin-left:;">
{Asker} asked:<br>
{Question}<br><div id="answer"><em>{Answer}</em></div><br><br>
</div></td></tr></tbody></table>
{/block:Answer}

{block:Photo}
<img src="{PhotoURL-500}" alt="{PhotoAlt}" width=500px/>
{block:ifshowcaption}<center>{block:Caption}{Caption}{/block:Caption}</center>{/block:ifshowcaption}
{block:PermalinkPage}
<center>{block:Caption}{Caption}{/block:Caption}</center>
{/block:PermalinkPage}
{/block:Photo}

{block:Quote}
<center><span class="title">{Quote}</span><br>
{block:Source}{Source}{/block:Source}</center>
{/block:Quote}

{block:Chat}
{block:Title}<span class="title" color="{color:link}">{Title}</span>{/block:Title}
<ul class="chat">
{block:Lines}
<li class="user_{UserNumber}>
{block:Label}
<span class="label">{Label}</span>
{/block:Label}
{Line}</li>{/block:Lines}</ul>
{/block:Chat}

{block:Audio}
<center><div style="width:400px; height:20px;">
<div style="float:left">{AudioPlayerWhite}</div>
<div style="margin-top:8px; float:right;"><small>
{FormattedPlayCount} plays {block:ExternalAudio} //
<a href="{ExternalAudioURL}">Download?</a>
{/block:ExternalAudio}</small></div></div></center><br>
{block:Caption}{Caption}{/block:Caption}
{/block:Audio}

{block:Video}
<center>{Video-500}<br>{block:Caption}{Caption}{/block:Caption}</center>
{/block:Video}

<br>
</div>

{block:PostNotes}
<center>
{block:NoteCount}{NoteCountWithLabel}<br>{/block:NoteCount}

{block:HasTags}
tagged as: {block:Tags}<a href="{TagURL}">{Tag}. </a>{/block:Tags}<br>
{/block:HasTags}

{block:RebloggedFrom}
reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
originally posted by
<a href="{ReblogRootURL}">{ReblogRootName}</a> {/block:RebloggedFrom}
</center></span>
<br><div id="postnotes">{PostNotes}</div><br>
{/block:PostNotes}<br>

{block:SearchPage}
<div class="post">
<h2 style="text-align: center;">search results for "{SearchQuery}"<br>
{block:NoSearchResults}no results found{/block:NoSearchResults}</h2>
</div>
{/block:SearchPage}

{/block:Posts}

{block:ifNOTinfinitescrolling}
<div style="margin-top: 20px; margin-bottom: 10px; text-align:center;">
</a>.
</div>
{/block:ifNOTinfinitescrolling}

</div>
</div>
</body></html>

JorGens · 2 Ene 2013, 23:21 · Solicitar retirada

Hola compañero!

Para empezar, tienes la etiqueta BODY dos veces, una con <body onload="comprobarScreen()"> y otra con <body>

Debes quitar la primera de ellas y dejar la segunda pero con <body onload="comprobarScreen()"> en lugar de tan solo <body>

Quizás haya más cosas... no deberían haber script antes de la línea <html lang="en">. Seguramente tengas que cortar esos scripts iniciales y colocarlos justo antes de </head>.

Cuéntanos qué tal van las modificaciones y si consigues algo, oki?

Un abrazo!