Vad jag tror är att sidan inte var färdigladdad på bilden, (Statusen visar ju att den fortfarande laddar) och därmed att inte alla stilmallar var inlästa.
Vilken läsare använde denna person?
HTML & CSSur HTML, XHTML & CSS
3 svar · 243 visningar · startad av costodia
Jag har problem med mina blogger-baserade webplats lager.
http://www.mittinternet.com/ är adressen till min weblog.
Det som häner är att lagrena blir för breda för vissa besökare och själv huvudlagret, med huvudtexten försvinner jättelångt ner på sidan (se bilden)

Jag undrar om det finns något sätt att fixa detta så att alla besökare kan se på sidan utan att detta händer?
Jag använder en modifierad blogger-stylesheet till sidan:
body {
background:#F9F8F3 url("http://sveriges.com/blankhorlin.gif") 50% 0;
margin:0;
padding:0 10px;
text-align:center;
font:x-small Verdana,Sans-serif;
color:#333;
font-size/* */:/**/small;
font-size: /**/small;
}
/* Page Structure
----------------------------------------------- */
#content {
background:url("http://sveriges.com/blankhorlin.gif") no-repeat 250px 50px;
width:700px;
margin:0 auto;
padding:50px 0;
text-align:left;
}
#main {
width:450px;
float:right;
padding:50px 0 20px;
font-size:85%;
}
#main2 {
background:url("http://sveriges.com/blankhorlin.gif") -100px -100px;
padding:20px 10px 15px;
}
#sidebar {
width:200px;
float:left;
font-size:85%;
padding-bottom:20px;
}
#sidebar2 {
background:url("http://sveriges.com/blankhorlin.gif") 150px -50px;
padding:5px 10px 15px;
width:200px;
width/* */:/**/180px;
width: /**/180px;
}
html>body #main, html>body #sidebar {
/* We only give this fade from white to nothing to
browsers that can handle 24-bit transparent PNGs */
background/* */:/**/url("http://sveriges.com/blankhorlin.gif") repeat-x left bottom;
}
/* Title & Description
----------------------------------------------- */
#blog-title {
margin:0 0 .5em;
font:250%/1.4em Georgia,Serif;
color:#353;
}
#blog-title a {
color:#353;
text-decoration:none;
}
#description {
margin:0 0 1.75em;
color:#996;
}
/* Links
----------------------------------------------- */
a:link {
color:#663;
}
a:visited {
color:#000000;
}
a:hover {
color:#7C7C43;
}
a img {
border-width:0;
}
/* Posts
----------------------------------------------- */
.date-header {
margin:0 0 .75em;
padding-bottom:.35em;
border-bottom:1px dotted #9b9;
font:95%/1.4em Georgia,Serif;
text-transform:uppercase;
letter-spacing:.3em;
color:#663;
}
.post {
margin:0 0 2.5em;
}
.post-title {
margin:.25em 0;
font:bold 130%/1.4em Georgia,Serif;
color:#333;
}
.post-title a, .post-title strong {
background:url("http://sveriges.com/bilder/030227/fyrkant_ljusbla.gif") no-repeat 0 .25em;
display:block;
color:#333;
text-decoration:none;
padding:0 0 1px 45px;
}
.post-title a:hover {
color:#000;
}
.post p {
margin:0 0 .75em;
line-height:1.6em;
}
p.post-footer {
margin:0;
text-align:right;
}
p.post-footer em {
display:block;
float:left;
text-align:left;
font-style:normal;
color:#996;
}
a.comment-link {
/* IE5.0/Win doesn't apply padding to inline elements,
so we hide these two declarations from it */
background/* */:/**/url("http://sveriges.com/bilder/030227/fyrkant_rod.gif") no-repeat 0 .25em;
padding-left:15px;
}
html>body a.comment-link {
/* Respecified, for IE5/Mac's benefit */
background:url("http://sveriges.com/bilder/030227/fyrkant_rod.gif") no-repeat 0 .25em;
padding-left:15px;
}
.post img {
margin:0 0 5px 0;
padding:4px;
border:1px solid #cca;
}
/* Comments
----------------------------------------------- */
#comments {
margin:0;
}
#comments h4 {
margin:0 0 10px;
border-top:1px dotted #9b9;
padding-top:.5em;
font:bold 110%/1.4em Georgia,Serif;
color:#333;
}
#comments-block {
line-height:1.6em;
}
.comment-poster {
background:url("http://sveriges.com/blankhorlin.gif") no-repeat 2px .35em;
margin:.5em 0 0;
padding:0 0 0 20px;
font-weight:bold;
}
.comment-body {
margin:0;
padding:0 0 0 20px;
}
.comment-body p {
margin:0 0 .5em;
}
.comment-timestamp {
margin:0 0 .5em;
padding:0 0 .75em 20px;
color:#996;
}
.comment-timestamp a:link {
color:#996;
}
.deleted-comment {
font-style:italic;
color:gray;
}
/* More Sidebar Content
----------------------------------------------- */
.sidebar-title {
margin:4em 0 .75em;
padding-bottom:.35em;
border-bottom:1px dotted #9b9;
font:95%/1.4em Georgia,Serif;
text-transform:uppercase;
letter-spacing:.3em;
color:#663;
}
#sidebar p {
margin:0 0 .75em;
line-height:1.6em;
}
#sidebar ul {
margin:.5em 0 1em;
padding:0 0px;
list-style:none;
line-height:1.5em;
}
#sidebar ul li {
background:url("http://sveriges.com/bilder/030227/fyrkant_brun.gif") no-repeat 3px .45em;
margin:0;
padding:0 0 5px 15px;
}
#sidebar p {
margin:0 0 .6em;
}
/* Profile
----------------------------------------------- */
.profile-datablock {
margin:0 0 1em;
}
.profile-img {
display:inline;
}
.profile-img img {
float:left;
margin:0 8px 5px 0;
border:4px solid #cc9;
}
.profile-data {
margin:0;
line-height:1.5em;
}
.profile-data strong {
display:block;
}
.profile-textblock {
clear:left;
}
/* Footer
----------------------------------------------- */
#footer {
clear:both;
padding:15px 0 0;
}
#footer hr {
display:none;
}
#footer p {
margin:0;
}
Vad jag tror är att sidan inte var färdigladdad på bilden, (Statusen visar ju att den fortfarande laddar) och därmed att inte alla stilmallar var inlästa.
Vilken läsare använde denna person?
det har du nog rätt i, jag har inte orkat kolla upp detta, men jag chansar på det. Tack för insikten föresten :-).
Det blir så för mig när jag besöker sidan.. hela vänster-delen på site´n trycks ner och hamnar under Arkivet.
Jag kör med: Mozilla/5.0 (Windows; U; Windows NT 5.1; rv:1.7.3) Gecko/20040913 Firefox/0.10
En tanke: :)
När du använder Strict-XHTML ska du tänka på att all padding som sätts på elementen även räknas på på dess bredd.
Det kan hända att det är där som problemet ligger?
Ett exempel:
Div´ens längd: 280px
Div´ens padding: 20px
Nu har div´en en längd på 320px istället för 280px..