General Question

johnny0313x's avatar

Div help?

Asked by johnny0313x (1855points) April 11th, 2008 from iPhone

I am new to using CSS and divs but trying to gt better knowledge. I am redesigning my portfolio site and used a div to position the content. It looks fine in safari on my mac but terriblely off center in ie and firefox. Can some take a look. Its just all rough draft and other things need to be fixed but here is what I am talking about http://www.lyonsdesign.info/about.HTML

Observing members: 0 Composing members: 0

8 Answers

Perchik's avatar

I got a page not found error. Check your link?

EDIT…if you make it .html lowercase it works.

soundedfury's avatar

When you position an element absolutely, it is defined by the edge of the document, which in this case is the browser window. So, when you resize the window the element will maintain the same position, even though the rest of your elements are centering.

You don’t really need to position it absolutely in this case, but there is a trick for when you do. Don’t specify a top or left property, but instead use the margin property to move it into position. Without a top or left property, position doesn’t know where to start and defaults to the container’s top and left edge, but maintains the same behavior.

So, something like:

#layer1 {
position: absolute;
margin-top: 190px;
margin-left: 180px;
width:400px;
height:330px;
overflow:auto
}

That is based on your current values.

johnny0313x's avatar

I am a little confused by what u mean. I kind of understand. I am new with divs and I get the general concept but just started trying to become more envolved wiith them. Is it possible to have it work the right way in all browsers?

johnny0313x's avatar

now that I rwread what u wrote it makes more sense. I think I understand.

soundedfury's avatar

It’s actually broken in all browsers right now. If you see it right in Safari, try resizing. It is correct on load because of the way Safari loads it, but not once you resize.

It’s absolutely able to be the same across browsers.

johnny0313x's avatar

Oh okay, I will have to try this, so you are telling me not to give it a top or left value that way it doesnt go by the browsers size but more so the size of the page? Is there another way to align this besides using absolute? I think divs are the best thing since….fluther lol I feel like since I started looking into them I have been out of the loop for so long haha. HOwever I am excited to see what I can use them for and how much easier they can make like them cutting up images into 20 parts and using a table to put them back together lol.

soundedfury's avatar

The nice thing about CSS and semantic markup is that there are multiple ways to do most things. So, yes, there are better and easier ways than absolute positioning. We can take this to private comments if you want.

johnny0313x's avatar

sure
that would be great, i am at work so my response is limited somewhat but it would be great to talk to someone who knows about this.

Answer this question

Login

or

Join

to answer.

This question is in the General Section. Responses must be helpful and on-topic.

Your answer will be saved while you login or join.

Have a question? Ask Fluther!

What do you know more about?
or
Knowledge Networking @ Fluther