View Full Version : How do divs work?


XxsamanthaxX
03-09-2003, 04:10 AM
I read some where that when you use divs, your site looks the same in any resolution. How is that possible?
Because when I switched the resolution on my computer from 800x600 to 764x1024 and looked at my site, all of my links on the right side, were to the far right.
Is it because I used position: absolute; right, instead of left?
Or is it just because everything on my screen only looks right in 800x600?

Thanks :)
-Samantha

alkaline39
03-09-2003, 05:23 AM
whats your website?

XxsamanthaxX
03-09-2003, 06:05 AM
Well my current site is gutterxblonde.net (http://www.gutterxblonde.net)
I'm getting a new domain soon. This is the link to the new layout gutterxblonde.net/atc.html (http://www.gutterxblonde.net/atc.html) to the new domain. It's not anywhere near finished...
This is my first layout using divs. I hope I'm doing this right......

MaGiCSuN
03-09-2003, 12:56 PM
for example if you have set left :100px for the links that are on the left (just for example) then theyw ill be 100px away from the left side In EVERY resolution.

You use right into your style position. Try to use ONLY left and top. Because if you position it all from top and left it will stay together in one whole layout in every resolution.

If you change all the "right: #px" to left and fill in the right numbers for it then the links will not go all the way to the right side when you view them in an bigger resolution.

Love,
Mirna

XxsamanthaxX
03-09-2003, 11:16 PM
Thanks for the help. I switched all of my rights to lefts and now everything looks ok.
But for some odd reason, now all of my fanlisting pics don't work. Their there, but you can't click on them to go to the site.
Can you not use divs to postion image links?

MaGiCSuN
03-10-2003, 05:19 PM
they probably don't work because you have closed the <img> tag with </img> and that isn't nessecary. You don't have to close image tags. Just <img src="url.gif"> is fine and try putting them on the same line. Some of your buttons have the <a href="url.html" on one line and then an enter and then the code goes on with the rest of the code.

also your body tags are pretty messsed up. You have 3 tags !!! i have no clue where you learned this but you can only have one body and one head tag. Like this:

<html>
<head>
</head>
<body>
stuff here
</body>
</html>

that's the base you use for setting up a page. I'm talking about this part:

<body bgcolor="#ff99ff" text="#ffccff" link="#ffccff" vlink="#ffccff" alink="#ffccff">


<body>


<STYLE>
BODY
{SCROLLBAR-FACE-COLOR: #ff99ff ;
SCROLLBAR-HIGHLIGHT-COLOR:#ffccff ;
SCROLLBAR-SHADOW-COLOR: #ffccff ;
SCROLLBAR-3DLIGHT-COLOR: #ffccff ;
SCROLLBAR-ARROW-COLOR: #ffccff ;
SCROLLBAR-TRACK-COLOR: #ff99ff ;
SCROLLBAR-DARKSHADOW-COLOR: #ffccff;
SCROLLBAR-BASE-COLOR: #ff99ff }

</STYLE>

<body bgcolor="#ff99ff">




</head>
<BODY bgcolor="#ff99ff" topmargin="0" leftmargin="0">

put the <STYLE> codes into your head tag that is a bit more higher in the code. Delete the </head> tag in the code above. Also delete the <body bgcolor="#ff99ff"> because it's allready in the body tag below that one. Then add the vlink, alink etc stuff into the otherbody tag and delete that body one. So to be sure your body tag must look like this:

<BODY bgcolor="#ff99ff" topmargin="0" leftmargin="0" text="#ffccff" link="#ffccff" vlink="#ffccff" alink="#ffccff">

and the scrollbar <STYLE> code must be in the same section as the link style codes.

i know i bug you allot haha but you positioned EVERYTHING seperate. Dunno why you did that, because everything that is on the left is on the SAME place, so you can position that into one div.

just position it on the place where the first word has to start. Then add the whole stuff that has to go on the right side, the links etc. It will autmatically go down, just set the width to the width you want it.

Then you make a <div> for the middle part and put there ALL the stuff in it and also set width for that one

and then make another <div> for the right side and put all the stuff into that one. In this way you can add all the links without divs and they will position exactly like you want it to be.

Love,
Mirna

XxsamanthaxX
03-10-2003, 06:08 PM
Well, I tried what you said about the image tags, but it still didn't work. Maybe I'm missing something...
lol, I don't know where I learned to do that either. But thanks for showing me the right way to do it. Changing the colors on my page and the links was such a pain because I had sooo many tags to change.....
The reason I positioned everything separate on the left side is because I want a certain amount of space between each thing. And I didn't know if I could do that by using just one div tag....
Now on the right side where the links are, I don't want them to go straight down like this:
link 1
link 2
link 3
I want them to go the way I have them now. Will they still look like that if I use just one div code?

Like I've said before, I've NEVER used divs, so I'm soooo new to all of this.

It's cool that you bug me about it. I need all the help that I can get.......


Thanks
-Samantha

MaGiCSuN
03-10-2003, 06:29 PM
Did you also putthose links on one line from the link images that you had trouble with?

in your source code you have:

<a href="urlhere.html"
Onmouseover bla bla bla"><img src="blah.gif"></a>

just as example.. try to put it on one line, because making enters in a code can sometimes lead to not working etc. Maybe you didn't do this by purpose, i have those things too that they give me a code and in the end it seemed that some parts of the code should be on one line like the page that gave it to me said it should work..

Love,
Mirna