How is this aligning for you?
It's perfectly aligned on my 1280x960 res, it's a little bit off on my laptop, and a lot off in 1024x768.
I'm using the position:absolute;, left:50%; and margin-left attributes, but it still isn't aligning in other resolutions. Any way to fix this? Also, textareas are not working for me... :/ is it because freewebs doesn't allow that or something?
Full Version: Alignment issues ><
^Okay, so I did that and now the home page (too lazy to do the rest atm) is aligned in 1024x768. Should it be aligned in other resolutions now?
Text areas are supposed to show up here in the empty spaces... but they're not showing up for me.
Text areas are supposed to show up here in the empty spaces... but they're not showing up for me.
Okay, thanks. I don't see why it wouldn't be working though, I haven't had alignment problems in the past that I couldn't fix :/
The live preview is not aligned for me. Is it because 1024x768 is a weird resolution? I'll see when I get home
The real question is why isn't aligning in the first place?
I use the same coding and attributes for my other layouts and they aligned fine in all resolutions.
The real question is why isn't aligning in the first place?
I use the same coding and attributes for my other layouts and they aligned fine in all resolutions.
The live preview isn't aligned for me in 1280x960 either.
Center like in the center of the page? If I made it center left, would it be ok? I'm going to try that I guess, since I don't want it to be in the center of the page.
edit// Here's the code for my homepage. I used the coding (fixed a few things), and it aligns in the template on my laptop except the links and content are too far down the page. It is aligned fine in 1280x960. Tried using relative positioning with the same result.
<html>
<head>
<title>E S T H E T I C A | designs</title>
<style type="text/css">
.positioning {Positions all DIV layers}
.content {position:absolute; overflow:auto; _top:284px; left:50%; _margin-left:-369px; width:362px; height:500px; background-color:transparent; border-color:222222; border-style:solid; border-width:0px;}
.navigation {position:absolute; overflow:hidden; _top:284px; left:50%; _margin-left:-604px; width:192px; height:184px; background-color:transparent; border-color:222222; border-style:solid; border-width:0px;}
body {
background-color:FFFFFF;
background-image:url(http://i41.tinypic.com/1491m9z.gif);
background-position:left;
background-repeat: no-repeat;
background-attachment: scroll;
scrollbar-arrow-color: #000000;
scrollbar-darkshadow-color: #ffffff;
scrollbar-track-color:#ffffff;
scrollbar-face-color: #ffffff;
scrollbar-shadow-color:#ffffff;
scrollbar-highlight-color:#ffffff;
scrollbar-3dlight-color: #ffffff;
margin:0px;
cursor: help;
}
div {
scrollbar-arrow-color: #B5E901;
scrollbar-face-color: #000000;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-track-color: #000000;
base-color: #000000;
}
body, div, p, strong, td, .text {
color:FFFFFF;
font-size:11px;
font-weight:normal;
font-style:normal;
text-decoration:none;
text-transform:none;
font-family:Arial;
letter-spacing:0px;
}
b {
color:FD3987;
letter-spacing:-1px;
line-height:14px;
font-size:14px;
font-weight:bold;
font-style:normal;
text-decoration:none;
text-transform:uppercase;
font-family:Georgia;
}
strong {
color:FD3987;
letter-spacing:-1px;
line-height:14px;
font-size:14px;
font-weight:bold;
font-style:normal;
text-decoration:none;
text-transform:none;
font-family:Georgia;
}
a {
color: B5E901 !important;
font-family: Arial !important;
text-transform: none !important;
font-weight: normal !important;
text-decoration: none !important;
}
a:hover {
color: 7777777 !important;
font-family: Arial !important;
text-transform: none !important;
font-weight: normal !important;
text-decoration: none !important;
cursor:crosshair;
}
.c {Customizes Custom Links}
a.linkies:link, a.linkies:active, a.linkies:visited {
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:111111;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#FD3987;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
margin-bottom:0px;
cursor:crosshair;
}
a.linkies:hover{
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:222222;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#FD3987;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
margin-bottom:0px;
}
a.linkies2:link, a.linkies2:active, a.linkies2:visited {
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:111111;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#B5E901;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
margin-bottom:0px;
}
a.linkies2:hover {
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:222222;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#B5E901;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
cursor:crosshair;
margin-bottom:0px;
}
</style>
<div class="navigation">
<a href="http://esthetica.webs.com/index.htm" class="linkies">HOME</a>
<br /><a href="http://esthetica.webs.com/MySpace%20content.htm" class="linkies2">MYSPACE CONTENT</a>
<br /><a href="http://esthetica.webs.com/Website%20content.htm" class="linkies">WEBSITE CONTENT</a>
<br /><a href="http://esthetica.webs.com/Tutorials.htm" class="linkies2">TUTORIALS</a>
<br /><a href="http://esthetica.webs.com/Services.htm" class="linkies">SERVICES</a>
<br /><a href="http://esthetica.webs.com/Contact.htm" class="linkies2">CONTACT</a>
<br /><a href="http://esthetica.webs.com/Site%20info.htm" class="linkies">SITE INFO</a><br>
</div>
<div class="content">
UNDER CONSTRUCTION.<p>
<!-- Freewebs Sticker -->
<noscript></noscript><!-- --><script type="text/javascript" src="http://www.freewebs.com/p.js"><...><script language="JavaScript" src="http://images.freewebs.com/JS/Freebar/btn_mirrorblack.js">
</script>
</div>
</body>
</html>
And, do you know what's wrong with the textareas?
Center like in the center of the page? If I made it center left, would it be ok? I'm going to try that I guess, since I don't want it to be in the center of the page.
edit// Here's the code for my homepage. I used the coding (fixed a few things), and it aligns in the template on my laptop except the links and content are too far down the page. It is aligned fine in 1280x960. Tried using relative positioning with the same result.
CODE
<html>
<head>
<title>E S T H E T I C A | designs</title>
<style type="text/css">
.positioning {Positions all DIV layers}
.content {position:absolute; overflow:auto; _top:284px; left:50%; _margin-left:-369px; width:362px; height:500px; background-color:transparent; border-color:222222; border-style:solid; border-width:0px;}
.navigation {position:absolute; overflow:hidden; _top:284px; left:50%; _margin-left:-604px; width:192px; height:184px; background-color:transparent; border-color:222222; border-style:solid; border-width:0px;}
body {
background-color:FFFFFF;
background-image:url(http://i41.tinypic.com/1491m9z.gif);
background-position:left;
background-repeat: no-repeat;
background-attachment: scroll;
scrollbar-arrow-color: #000000;
scrollbar-darkshadow-color: #ffffff;
scrollbar-track-color:#ffffff;
scrollbar-face-color: #ffffff;
scrollbar-shadow-color:#ffffff;
scrollbar-highlight-color:#ffffff;
scrollbar-3dlight-color: #ffffff;
margin:0px;
cursor: help;
}
div {
scrollbar-arrow-color: #B5E901;
scrollbar-face-color: #000000;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-track-color: #000000;
base-color: #000000;
}
body, div, p, strong, td, .text {
color:FFFFFF;
font-size:11px;
font-weight:normal;
font-style:normal;
text-decoration:none;
text-transform:none;
font-family:Arial;
letter-spacing:0px;
}
b {
color:FD3987;
letter-spacing:-1px;
line-height:14px;
font-size:14px;
font-weight:bold;
font-style:normal;
text-decoration:none;
text-transform:uppercase;
font-family:Georgia;
}
strong {
color:FD3987;
letter-spacing:-1px;
line-height:14px;
font-size:14px;
font-weight:bold;
font-style:normal;
text-decoration:none;
text-transform:none;
font-family:Georgia;
}
a {
color: B5E901 !important;
font-family: Arial !important;
text-transform: none !important;
font-weight: normal !important;
text-decoration: none !important;
}
a:hover {
color: 7777777 !important;
font-family: Arial !important;
text-transform: none !important;
font-weight: normal !important;
text-decoration: none !important;
cursor:crosshair;
}
.c {Customizes Custom Links}
a.linkies:link, a.linkies:active, a.linkies:visited {
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:111111;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#FD3987;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
margin-bottom:0px;
cursor:crosshair;
}
a.linkies:hover{
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:222222;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#FD3987;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
margin-bottom:0px;
}
a.linkies2:link, a.linkies2:active, a.linkies2:visited {
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:111111;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#B5E901;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
margin-bottom:0px;
}
a.linkies2:hover {
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:222222;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#B5E901;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
cursor:crosshair;
margin-bottom:0px;
}
</style>
<div class="navigation">
<a href="http://esthetica.webs.com/index.htm" class="linkies">HOME</a>
<br /><a href="http://esthetica.webs.com/MySpace%20content.htm" class="linkies2">MYSPACE CONTENT</a>
<br /><a href="http://esthetica.webs.com/Website%20content.htm" class="linkies">WEBSITE CONTENT</a>
<br /><a href="http://esthetica.webs.com/Tutorials.htm" class="linkies2">TUTORIALS</a>
<br /><a href="http://esthetica.webs.com/Services.htm" class="linkies">SERVICES</a>
<br /><a href="http://esthetica.webs.com/Contact.htm" class="linkies2">CONTACT</a>
<br /><a href="http://esthetica.webs.com/Site%20info.htm" class="linkies">SITE INFO</a><br>
</div>
<div class="content">
UNDER CONSTRUCTION.<p>
<!-- Freewebs Sticker -->
<noscript></noscript><!-- --><script type="text/javascript" src="http://www.freewebs.com/p.js"><...><script language="JavaScript" src="http://images.freewebs.com/JS/Freebar/btn_mirrorblack.js">
</script>
</div>
</body>
</html>
And, do you know what's wrong with the textareas?
The textareas seem to be working fine for me...
It's completly messed up for me.
All I see is the bottom half of the layout.
All I see is the bottom half of the layout.
^What browser are you using? Everything shows up in IE, despite the mis-alignment.
QUOTE(imperfectionistx @ Apr 30 2009, 07:58 PM) 
^What browser are you using? Everything shows up in IE, despite the mis-alignment.
FF
Here's How it looks for me:
I think that instead of setting the layout image as the body background, you should set it as it's own div.
Also, maybe you should add the textarea class to your codes and edit it's properites. Like so:
Also, maybe you should add the textarea class to your codes and edit it's properites. Like so:
CODE
textarea {
width: ###px;
height: ###px;}
width: ###px;
height: ###px;}
^Thanksss Mike (: Now the textareas are working. I also did what you suggested and made the bg in its own DIV. Any differences?
QUOTE(A1Bassline @ May 1 2009, 04:23 PM)
What kind of top positioning are you using?
Me or imperfectionistx?
You need to make sure it works no matter what the resolution is! Cause even though my screen is 1440x900, it wasnt fullscreen.
QUOTE(A1Bassline @ May 1 2009, 05:42 PM)
Imperfectionistx because she's the one coding. :P
Okay. I wasn't sure.
This is the coding I'm using atm. It's aligning in 1280x960 and on my laptop.
<html>
<head>
<title>E S T H E T I C A | designs</title>
<style type="text/css">
.positioning {Positions all DIV layers}
.content {position:absolute; overflow:auto; _top:284px; left:50%; _margin-left:-369px; width:362px; height:500px; background-color:transparent; border-color:222222; border-style:solid; border-width:0px;}
.navigation {position:absolute; overflow:hidden; _top:284px; left:50%; _margin-left:-604px; width:192px; height:184px; background-color:transparent; border-color:222222; border-style:solid; border-width:0px;}
.image {background-image:url('http://i41.tinypic.com/1491m9z.gif'); background-repeat: no-repeat;
background-attachment: scroll; position:absolute; overflow:hidden; _top:40px; left:50%; _margin-left:-630px; width:650px; height:778px;}
body {
background-color:FFFFFF;
scrollbar-arrow-color: #000000;
scrollbar-darkshadow-color: #ffffff;
scrollbar-track-color:#ffffff;
scrollbar-face-color: #ffffff;
scrollbar-shadow-color:#ffffff;
scrollbar-highlight-color:#ffffff;
scrollbar-3dlight-color: #ffffff;
margin:0px;
cursor: help;
}
div {
scrollbar-arrow-color: #B5E901;
scrollbar-face-color: #000000;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-track-color: #000000;
base-color: #000000;
}
body, div, p, strong, td, .text {
color:FFFFFF;
font-size:11px;
font-weight:normal;
font-style:normal;
text-decoration:none;
text-transform:none;
font-family:Arial;
letter-spacing:0px;
}
textarea {
width: 200px;
height: 50px;
background-color:222222 !important;
border: 1px solid #111111 !important;
font-family: arial !important;
color: #B5E901 !important;
}
b {
color:FD3987;
letter-spacing:-1px;
line-height:14px;
font-size:14px;
font-weight:bold;
font-style:normal;
text-decoration:none;
text-transform:uppercase;
font-family:Georgia;
}
strong {
color:FD3987;
letter-spacing:-1px;
line-height:14px;
font-size:14px;
font-weight:bold;
font-style:normal;
text-decoration:none;
text-transform:none;
font-family:Georgia;
}
a {
color: B5E901 !important;
font-family: Arial !important;
text-transform: none !important;
font-weight: normal !important;
text-decoration: none !important;
}
a:hover {
color: 7777777 !important;
font-family: Arial !important;
text-transform: none !important;
font-weight: normal !important;
text-decoration: none !important;
cursor:crosshair;
}
.c {Customizes Custom Links}
a.linkies:link, a.linkies:active, a.linkies:visited {
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:111111;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#FD3987;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
margin-bottom:0px;
cursor:crosshair;
}
a.linkies:hover{
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:222222;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#FD3987;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
margin-bottom:0px;
}
a.linkies2:link, a.linkies2:active, a.linkies2:visited {
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:111111;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#B5E901;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
margin-bottom:0px;
}
a.linkies2:hover {
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:222222;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#B5E901;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
cursor:crosshair;
margin-bottom:0px;
}
</style>
<div class="image"></div>
<div class="navigation">
<a href="http://esthetica.webs.com/index.htm" class="linkies">HOME</a>
<br /><a href="http://esthetica.webs.com/MySpace%20content.htm" class="linkies2">MYSPACE CONTENT</a>
<br /><a href="http://esthetica.webs.com/Website%20content.htm" class="linkies">WEBSITE CONTENT</a>
<br /><a href="http://esthetica.webs.com/Tutorials.htm" class="linkies2">TUTORIALS</a>
<br /><a href="http://esthetica.webs.com/Services.htm" class="linkies">SERVICES</a>
<br /><a href="http://esthetica.webs.com/Contact.htm" class="linkies2">CONTACT</a>
<br /><a href="http://esthetica.webs.com/Site%20info.htm" class="linkies">SITE INFO</a><br>
</div>
<div class="content">
UNDER CONSTRUCTION.<p>
textarea<p>
<textarea>sample</textarea>
<!-- Freewebs Sticker -->
<noscript></noscript><!-- --><script type="text/javascript" src="http://www.freewebs.com/p.js"><...><script language="JavaScript" src="http://images.freewebs.com/JS/Freebar/btn_mirrorblack.js">
</script>
</div>
</body>
</html>
CODE
<html>
<head>
<title>E S T H E T I C A | designs</title>
<style type="text/css">
.positioning {Positions all DIV layers}
.content {position:absolute; overflow:auto; _top:284px; left:50%; _margin-left:-369px; width:362px; height:500px; background-color:transparent; border-color:222222; border-style:solid; border-width:0px;}
.navigation {position:absolute; overflow:hidden; _top:284px; left:50%; _margin-left:-604px; width:192px; height:184px; background-color:transparent; border-color:222222; border-style:solid; border-width:0px;}
.image {background-image:url('http://i41.tinypic.com/1491m9z.gif'); background-repeat: no-repeat;
background-attachment: scroll; position:absolute; overflow:hidden; _top:40px; left:50%; _margin-left:-630px; width:650px; height:778px;}
body {
background-color:FFFFFF;
scrollbar-arrow-color: #000000;
scrollbar-darkshadow-color: #ffffff;
scrollbar-track-color:#ffffff;
scrollbar-face-color: #ffffff;
scrollbar-shadow-color:#ffffff;
scrollbar-highlight-color:#ffffff;
scrollbar-3dlight-color: #ffffff;
margin:0px;
cursor: help;
}
div {
scrollbar-arrow-color: #B5E901;
scrollbar-face-color: #000000;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-shadow-color: #000000;
scrollbar-track-color: #000000;
base-color: #000000;
}
body, div, p, strong, td, .text {
color:FFFFFF;
font-size:11px;
font-weight:normal;
font-style:normal;
text-decoration:none;
text-transform:none;
font-family:Arial;
letter-spacing:0px;
}
textarea {
width: 200px;
height: 50px;
background-color:222222 !important;
border: 1px solid #111111 !important;
font-family: arial !important;
color: #B5E901 !important;
}
b {
color:FD3987;
letter-spacing:-1px;
line-height:14px;
font-size:14px;
font-weight:bold;
font-style:normal;
text-decoration:none;
text-transform:uppercase;
font-family:Georgia;
}
strong {
color:FD3987;
letter-spacing:-1px;
line-height:14px;
font-size:14px;
font-weight:bold;
font-style:normal;
text-decoration:none;
text-transform:none;
font-family:Georgia;
}
a {
color: B5E901 !important;
font-family: Arial !important;
text-transform: none !important;
font-weight: normal !important;
text-decoration: none !important;
}
a:hover {
color: 7777777 !important;
font-family: Arial !important;
text-transform: none !important;
font-weight: normal !important;
text-decoration: none !important;
cursor:crosshair;
}
.c {Customizes Custom Links}
a.linkies:link, a.linkies:active, a.linkies:visited {
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:111111;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#FD3987;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
margin-bottom:0px;
cursor:crosshair;
}
a.linkies:hover{
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:222222;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#FD3987;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
margin-bottom:0px;
}
a.linkies2:link, a.linkies2:active, a.linkies2:visited {
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:111111;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#B5E901;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
margin-bottom:0px;
}
a.linkies2:hover {
background-image:url("");
background-repeat: no-repeat;
background-position: left;
background-color:222222;
color:ffffff !important;
font-family:small fonts;
font-size:7px;
text-align:left;
border-left-style:solid;
border-left-width:5px;
border-left-color:#B5E901;
padding-left:10px;
line-height:12px;
text-decoration:none;
width:192px;
text-transform:uppercase;
font-weight:normal;
letter-spacing:1px;
cursor:crosshair;
margin-bottom:0px;
}
</style>
<div class="image"></div>
<div class="navigation">
<a href="http://esthetica.webs.com/index.htm" class="linkies">HOME</a>
<br /><a href="http://esthetica.webs.com/MySpace%20content.htm" class="linkies2">MYSPACE CONTENT</a>
<br /><a href="http://esthetica.webs.com/Website%20content.htm" class="linkies">WEBSITE CONTENT</a>
<br /><a href="http://esthetica.webs.com/Tutorials.htm" class="linkies2">TUTORIALS</a>
<br /><a href="http://esthetica.webs.com/Services.htm" class="linkies">SERVICES</a>
<br /><a href="http://esthetica.webs.com/Contact.htm" class="linkies2">CONTACT</a>
<br /><a href="http://esthetica.webs.com/Site%20info.htm" class="linkies">SITE INFO</a><br>
</div>
<div class="content">
UNDER CONSTRUCTION.<p>
textarea<p>
<textarea>sample</textarea>
<!-- Freewebs Sticker -->
<noscript></noscript><!-- --><script type="text/javascript" src="http://www.freewebs.com/p.js"><...><script language="JavaScript" src="http://images.freewebs.com/JS/Freebar/btn_mirrorblack.js">
</script>
</div>
</body>
</html>
^ i might be wrong, but i think the underscore hack only works in IE6 and earlier. IE7 and IE8 won't recognize it. they work on myspace because myspace wrote a script to accept that hack.
Ok I'll try to put those back in... any difference?
Now it's cut off (at least for me) on the left site. You can only see "avigation" instead of "navigation". The nav and content aren't in their specific places.
I'm not sure why it's not working for you but it's aligning for me now in 1280x960 and 1440x900 and on my laptop.
^What parts are off? I changed just the background positioning to just left:0%; and it's aligning for me. I know the content isn't aligning on my laptop but it is in 1280x960 and 1440x900. If I changed all the content positioning to left:0%; and positioned from there, would it align?
You can re-do the coding if you want, I only need the div coding to be redone if it still doesn't work.
You can re-do the coding if you want, I only need the div coding to be redone if it still doesn't work.
QUOTE(A1Bassline @ May 6 2009, 06:56 AM)
The content and navigation were all the way at the top to the right. I adjusted your coding, checked it in Internet Explorer and Safari (you'll have to check in Firefox because Firefox doesn't work on my computer). What I did was positioned the template in the center. When it's in the center, you won't run into problems with positioning because people have different resolutions so if you tried all the way to the left on your computer, someone with a different resolution might have part of the template cut off or the content would be over more than it's supposed to.
Here is a preview:
http://tmarshdesign.webs.com/webmasterscor...ectionistx.html
Here is a preview:
http://tmarshdesign.webs.com/webmasterscor...ectionistx.html
The preview works perfectly in Firefox. I just checked. Good layout, btw.
^Thanks (:
http://esthetica.webs.com/index.htm
Okay, so I changed all the content positioning to left:0%; and positioned from there. How is it aligning now?
I thought that in any resolution, left:0%; will align all the way to the left on your screen. It wasn't aligning properly because I had it set to left:50%; which would align in the center + margin-left attributes, which are different in everyone's resolution. So now that I set it to left:0%, it should align at the left in all resolutions? I think.
If it still doesn't work I'll give up and put it in the center lol
http://esthetica.webs.com/index.htm
Okay, so I changed all the content positioning to left:0%; and positioned from there. How is it aligning now?
I thought that in any resolution, left:0%; will align all the way to the left on your screen. It wasn't aligning properly because I had it set to left:50%; which would align in the center + margin-left attributes, which are different in everyone's resolution. So now that I set it to left:0%, it should align at the left in all resolutions? I think.
If it still doesn't work I'll give up and put it in the center lol
QUOTE(imperfectionistx @ May 6 2009, 05:51 PM)
^Thanks (:
http://esthetica.webs.com/index.htm
Okay, so I changed all the content positioning to left:0%; and positioned from there. How is it aligning now?
I thought that in any resolution, left:0%; will align all the way to the left on your screen. It wasn't aligning properly because I had it set to left:50%; which would align in the center + margin-left attributes, which are different in everyone's resolution. So now that I set it to left:0%, it should align at the left in all resolutions? I think.
If it still doesn't work I'll give up and put it in the center lol
http://esthetica.webs.com/index.htm
Okay, so I changed all the content positioning to left:0%; and positioned from there. How is it aligning now?
I thought that in any resolution, left:0%; will align all the way to the left on your screen. It wasn't aligning properly because I had it set to left:50%; which would align in the center + margin-left attributes, which are different in everyone's resolution. So now that I set it to left:0%, it should align at the left in all resolutions? I think.
If it still doesn't work I'll give up and put it in the center lol
It doesn't work. I would give up, not to be mean or anything. It looks good in the center.
^How is it aligning? A little or a lot off?
I really don't want it in the center that's why; I meant for it to be on the left. But if no one can figure out how to properly align it on the left, I guess I'll have to give in and center it >:/
There has to be a way to align this though, right? I've seen lots of website layouts that are left or right aligned.
I really don't want it in the center that's why; I meant for it to be on the left. But if no one can figure out how to properly align it on the left, I guess I'll have to give in and center it >:/
There has to be a way to align this though, right? I've seen lots of website layouts that are left or right aligned.
QUOTE(imperfectionistx @ May 6 2009, 05:58 PM)
^How is it aligning? A little or a lot off?
I really don't want it in the center that's why; I meant for it to be on the left. But if no one can figure out how to properly align it on the left, I guess I'll have to give in and center it >:/
There has to be a way to align this though, right? I've seen lots of website layouts that are left or right aligned.
I really don't want it in the center that's why; I meant for it to be on the left. But if no one can figure out how to properly align it on the left, I guess I'll have to give in and center it >:/
There has to be a way to align this though, right? I've seen lots of website layouts that are left or right aligned.
All of a sudden it went
I went to your website content page and the content and navigation text/links are mis-aligned to the left. The navigation is off of the screen.
^Ahhh YAY :D
I aligned everything to left:0%; and _left:0%; etc. etc. Hopefully it's all good in all resolutions now.
Thanks for all the help (:
I aligned everything to left:0%; and _left:0%; etc. etc. Hopefully it's all good in all resolutions now.
Thanks for all the help (:
QUOTE(imperfectionistx @ May 6 2009, 06:04 PM)
^Ahhh YAY :D
I aligned everything to left:0%; and _left:0%; etc. etc. Hopefully it's all good in all resolutions now.
Thanks for all the help (:
I aligned everything to left:0%; and _left:0%; etc. etc. Hopefully it's all good in all resolutions now.
Thanks for all the help (:
idk if you saw it but I edited my post.
^I know those are not aligned. I stated in a previous post that I only was working on the home page to test if it would align before changing the rest (;
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.