CSS help/positioning

[Maylin]

What code can be used to get css boxes exactly where you want them to show up. Wheter the site is in Mozilla or Internet Explorer, how do I get it to where it looks the same in both browsers. I've tried the position: relative and the position:absolute. It looks fine in Mozilla but not in Internet Explorer. If I have a css box aligned left in Mozilla its fine, but when viewed in Internet Explorer, it runs off the page. Is more "stricter" css code needed to get a site to show up exactly the same in css coding, if so, do I use tables, lists. I just don't know :yell: :tu:

 

[Shinjikun]

If your using div tags you will need the IE hack to get it to work in both. Not to mention the 2 pixel difference grr... Best to use tables :D

 

[Chronos]

Your code will be needed to see which is wrong on it.

Usually there are two positioning ways to do whatever you want

<div style="position:absolute: top:XXpx; left:XXpx;"> CONTENT </div>

where XX is where you want the content appears from the top or changing the values to:

bottom:XXpx; for the bottom
right:XXpx; for riigh positioning.

relative positioning is harder in some cases, so stick to absolute if you are having cross browser incompatibilities.

Optionally, you can specify width and other elements such text align as part of your styled div.

the other way to position is:

<div style="float:left;">CONTENT</div>
<div style="float:right;">CONTENT</div>

this let you create boxes and keep centered other content at your desire.

the float attibute allow you to specify size so you can create 4 or more boxes per page using something like this:

<div style="float:left; width:25%;">CONTENT</div>
<div style="float:left; width:25%;">CONTENT</div>
<div style="float:left; width:25%;">CONTENT</div>
<div style="float:left; width:25%;">CONTENT</div>

For further information visit the positioning everything site:

http://www.positioniseverything.net

hope this help

 

[LeetPCUser]

The thing is, no matter what you use everything will be off. Both tables and div tags seem to have problems. Here is what I noticed.

Tables: With tables I have noticed if you use a lot of them sometimes your picture alignment tends to be 1px off. Of course, once you get good enough with them you will be able to fix them. I just have never truly had success with them. Also, it is quite a bit of code on one page and looks dirty to me.

Divs/CSS: Very nitpicky work. Once you get a hang of how to make things look good then it will be easy. I have noticed, at least right now, it is the cutting edge. Some people are still loving tables, but most are switching over.

This happens because nobody has a set standard for internet regulations. Of course, Bill Gates thinks because IE was one of the first and he motivated the computer world that everything he does is right and everyone should mimmick his rules. If you have coded long enough you can tell there are a lot of inconsistancies with IE's coding regulations. So, until there are regulations you will always have problems that need tweaking and extra coding. I know it is a pain, but it is the horrible web designing truth.

Hope this helps and good luck,

 

[bgolat]

i would highly recommend getting a css book. i have read a couple, my favorite is the css anthology by sitepoint. once you have an understanding of how things work and go through some real world examples it will be much easier.