View Full Version : fixed-width layout- help pls!


winlin
07-17-2006, 07:16 PM
sigh, im tearing my hair over this. how do i create fixed-table layouts?? is there someone whos good in this field, i really need help from a samaritan!!

this is my template portion before the contents of my daily posts in my blog. below the dotted lines is the ending portion of my template contents..

on different screen sizes, my entire blog looks over-stretched on thier screen but just the way i want it to be on mine... i read up on it and discovered fixed-width layouts which i believe should be the solution to the problem, but i cant figure it out. And i believe my template (CSS-> is this what it should be called?) is wrong also. The image link that you see in the fourth sentence below is actually the top banner to my blog, but i don't know the correct way of doing it, so i put it up akin to an image link... and it kinda works.. but looks over stretched along with everything else on my blog on others' screens nonetheless... sigh, anyone ?? ill be really thankful!

winlin
07-17-2006, 07:17 PM
<html>
<head>
<br><br><br><br><br>
<center><a href="http://imageshack.us"><img src="http://img517.imageshack.us/img517/8256/finale6vk.jpg" border="0" width="707" alt="Image Hosted by ImageShack.us" /></a></center>
<title>do you like your toes to be tickled? </title>

<style type="text/css">






body {

margin: 0px;
scrollbar-face-color: #ffffff;
scrollbar-shadow-color: #990000;
scrollbar-highlight-color: #990000;
scrollbar-3dlight-color: #ffffff;
scrollbar-darkshadow-color: #ffffff;
scrollbar-track-color: #ffffff;
scrollbar-arrow-color: #ffffff;
color: #990000;
}
.blogg {
font-family: tahoma, verdana;
font-size: 11px;
line-height: 1.3em;
color: #000000;
text-align: justify;
vertical-align: top;
padding: 10px;
border-top: 0px solid #FFFFFF;
border-right: 0px solid #993366;
}
.blogg2 {
text-align: left;
vertical-align: top;
padding: 10px;
margin: 0;
}
.blogbox {
text-align: justify;
vertical-align: top;
}
.lalala {
border: none;
}.side {
text-align: left;
vertical-align: top;
}

.sideee {
border: 0px solid #FFFFFF
padding: 5px;
font-family: Tahoma, New York, Arial, Verdana;
font-size: 10px;



}
.sidetop {
font-family: Tahoma, New York, Arial, Verdana;
font-size: 11px;
color:#990000;
text-align: right;}
.datetimeheader {
font-family: Tahoma, New York, Arial, Verdana;
font-size: 12px;
font-weight: normal;
color: #990000;
}
.datetimefooter {
font-family: Tahoma, New York, Arial, Verdana;
font-size: 11px;
color: #990000;
}
a:link {
color: #990000;
text-decoration: underline;
}
a:visited {
color: #990000;
text-decoration: underline;
}
a:active {
color: #990000;
text-decoration: none;
}
a:hover {
color: #990000;
text-decoration: none;
}
</style>
<!-- The following script is used only in Preview. It does not appear in the version that you apply to your blog. -->
<script language="JavaScript" type="text/javascript">
function targetLinksBS() {
for (var i=0; i<=(document.links.length-1); i++) {
document.links[i].target = "_blank";
}
}
</script>
<!-- End Preview script. -->
</head>
<body onLoad="targetLinksBS();" bgcolor="#FFFFFF">
<table border="0" cellpadding="0" cellspacing="0" width="707px" valign="top" height="450px" align="center">
<tr border="0" height="707px" width="450px" valign="top">
<td width="707px" class="blogbox" border="0" valign="top" >
<br>


<br><br><br><table width="50px" height="10px">
<center><tr><td></td></tr></table align="right">
<table valign="top" class="blogg" width="00" height="300px">

<tr><td>
<div class="blogg2"></center>



</style>
</head>
.................................................. .................................................. ......

winlin
07-17-2006, 07:18 PM
<br><br>
<a href="http://maystardesigns.com"><font color="ffffff"> design (c) maystar designs</font></a><a href="http://maystardesigns.com"><font color="ffffff"> image (c) maystar designs</font></a>
</div>
<br><br><br><br>

</td></tr></table>


<td width="50px" class="lalala" border="0" valign="top" height="1000px">
<td class="side" width="150px" border="0" valign="top" >
<br><br>
<Hspace="400px" Vspace="10px">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<table align="right">
<tr><td align="left" class="sidetop" valign="bottom" height="30px" width="200px" >
</td></tr>
<tr><td align="left" valign="top" class="sideee" height="100px"width="200px">
<br><br><br><center><a href="http://imageshack.us"><img src="http://img291.imageshack.us/img291/9084/contents13yc.jpg" border="0" width="97" alt="Image Hosted by ImageShack.us" /></a></center>
<br><a href="http://imageshack.us"><img src="http://img405.imageshack.us/img405/5640/meinyellowblack2vr.jpg" border="0" width="129" alt="Image Hosted by ImageShack.us" /></a><br>name: winlin*
<br>nickname: shaggy phun
<br>school: smu (biz)
<br>age: 21
<br>sex: girl*
</td>
</tr>
<tr><td align="left" class="sidetop" valign="bottom" height="21px" width="200px">
</td></tr>
<tr><td align="left" valign="top" class="sideee" height="100px" width="200px">
<a href="http://imageshack.us"><img src="http://img415.imageshack.us/img415/2188/archives14mp.jpg" border="0" width="97" alt="Image Hosted by ImageShack.us" /></a>

winlin
07-17-2006, 07:19 PM
is this alright?