PDA

View Full Version : Div Help Please

adams92891
07-01-2004, 12:23 AM
ok so im going to sell the layout here: http://www.freewebs.com/xtinalayout/ on another forum and i positioned the divs but when i maximized the screen the positioning was all messed up. how do i fix it so that it is positioned correctly on all screen resolutions?
ham_let
07-01-2004, 01:25 AM
use absolute positioning instead of percentages... <div style="position:absolute; top:?px; left:?px;"> BLAH </div>
salomeyasobko
07-01-2004, 01:42 AM
use absolute positioning instead of percentages... <div style="position:absolute; top:?px; left:?px;"> BLAH </div>
you got it a bit mixed up :D use percentages instead of pixels, that way it'll look the same in all resolutions:

<div style="position:absolute; top:##%; left:##%;"> content here </div>

edit the bold parts.. :)
adams92891
07-01-2004, 02:40 AM
Ok i did that and now the entire thing is messed up??
this is my code:
<html>
<head>
<STYLE TYPE="text/css">
select
{background:#000000;
font-family:century gothic;
color:white;
font-size: 8pt}

textarea, input{
font-family: century gothic;
font-size: 8pt;
color:blue;
background:white;
border-style: dashed;
border-width: 1px;
border-color:red; }
BODY {
color:black;
font-size:8pt;
font-family:century gothic;
text-align:justify;
cursor:ne-resize;
background-color:black;
background-attachment : fixed;
line-height: 15px;
scrollbar-face-color: black;

scrollbar-highlight-color: black;

scrollbar-3dlight-color: black;

scrollbar-darkshadow-color: black;

scrollbar-shadow-color: black;

scrollbar-arrow-color: yellow;

scrollbar-track-color: black;}

A:link{color:blue; text-decoration: underline; font-weight:bold}
A:visited{color:yellow; text-decoration: overline; font-weight:normal}
A:active{color:yellow; text-decoration: underline overline; font-weight:normal}
A:hover{color:yellow; text-decoration:none;font-weight:normal; text-transform:none; height:1; border:solid 1pt black; border:solid 1pt #lack; cursor:ne-resize; }

</style>

<title>SAMPLE</title>
</head>
<body>

<center><img src="http://www.freewebs.com/vintag3/xtina2%20yes.jpg" USEMAP="#whatever" border=0><p></center>

<div style="position: absolute; top: 470%; left: 700%;">
<a href ="an et">link</a>
<br>
<a href ="ajabn">link</a>
<br>
<a href ="aet">link</a>
<br>
<a href ="ganbja">link</a>
<br>
<a href ="http://vintag3.tk">thanks vintag3!</a>
<br>

<a href ="http://freewebs.com">host</a>

</div>
<top align=0><left align=0>

<div style="position: absolute; top: 470%; left: 250%; "><p>blah blah you can also buy just the graphic on top for the same price. most things can be changed :)
<br>
bidding starts at 0.50<br>
auto:none yet<br>
min increasement: 0.10<br>
paypal only
</p></div>
</body>
</html>
salomeyasobko
07-01-2004, 02:43 AM
you can have something OVER 100% from either side.. the window is 100% big both ways! since it's out of 100%, mess around with it until you get the right numbers.. or say you're using 800x600, think of it as 250/800 = X% and 470/600 = X%...
adams92891
07-01-2004, 03:01 AM
it STILL doesnt work, the positioning changes when i minimize the screen:(
ham_let
07-01-2004, 03:12 AM
ARGGH! stupid internet... i wrote some long reply and the internetmessed up as it was being sent.. err. the summerized version...
you got it a bit mixed up :D use percentages instead of pixels, that way it'll look the same in all resolutions:

<div style="position:absolute; top:##%; left:##%;"> content here </div>

edit the bold parts.. :)
yea, but i itnhk that absolute poisitioning works in this case b/c you can't strecth a graphic (to make it look good anyways..), so all the divs need to be in the correct spots ALL the time, and can't shift across the screen. to make it look good for both resolutions, just make the layouts work with 800x600 (it was made for that resolution anyways) and provide a link saying '1028x768?', and when somone clicks it they go to a version that has the layout (still in absolute positioning) in the exact center for 1028x768... hard to explain lol
jtchange
07-01-2004, 03:19 AM
for use on all resolutions: absolute positioning using percentages is the way to go, if you don't want to make 2 different sites(which is pointless)....if you play around with the percentages, you should figure it out
adams92891
07-01-2004, 03:34 AM
i did play around with the percentages and this is what i got: http://www.freewebs.com/xtinalayout/ so how do i play around with the percenteges any more?

can someone with an 800x600 plesae tell me what they see?with a screen shot or something?
Merike
07-02-2004, 08:30 AM
It seems to stay in top left corner with any screen solution.