Jump to content

General question on the correctness of what I am explaining in my comments

j.smith1981

By j.smith1981
in CSS Help

 Share

Recommended Posts

j.smith1981 Regular Member

j.smith1981

Posted
Posted

This is more of a general question to say am I right in saying this?

 

<html>
  <head>
  <style type="text/css">
#branding {
  width: 70em;
  height: 10em;
  position: relative;
}

#branding .tel {
  position: absolute;
  right: 1em;
  bottom: 1em;
  text-align: right;
}
  </style>
    <title></title>
  </head>
  <body>
  
    <div id="branding">
  <p class="tel">This is the telephone no: 01423</p>
</div>
  
  </body>
</html>

 

I have made some assumptions but want correcting if I have got anything wrong.

 

This really is entirely about relative vs absolute positioning, does relative mean to its orignal position within the document?

 

Like if I put say:

<div id="heading"> <!-- say this was relative margin-top: 20px; -->
  <h1>This is My sites heading!</h1>
</div>

 

This would be in relation to its original position in the document right?

 

Then absolute would be in relation to that if its within what?

 

Sorry I am really getting confused about this, just trying to really understand the positioning systems within CSS, learning allot just need some extra clarification over something I have been reading in my own time.

 

Thanks and I appreciate any opinions and views in advance,

Jez.

cssfreakie Regular Member

cssfreakie

Posted
Posted

this sounds a bit stupid, but the best explanation can be found in the manual: http://www.w3.org/TR/CSS2/visuren.html

 

note the main difference between absolute and relative positioned elements is that absolute positioned ones are taken out of the normal flow; in other words they will not give dimensions (height and width) to the parent element or bother other elements.

 

pretty poften you wrap a div with position relative (i.e. a #wrapper) around a elements that have a position absolute. those absolute ones than behave within the dimension of the relative wrapper. Anyway i would have a look in the manual, as you might expect we can't summarize all that in 3 lines. Hope this helps though

j.smith1981 Regular Member

j.smith1981

Posted
  • Author
Posted

No no thank you ever so much for your help, it is not stupid at all.

 

As I said in my OP I appreciate any replies and thank you ever so much!

 

Will read up on it, it's all about what circumstances your putting the tags in and I fully appreciate that from the reading I have been doing, from what I have been reading it's all about developing your own systems for doing things, or approaches rather, but there are some technicalities which I am getting into.

 

Again thank you,

Jez

cssfreakie Regular Member

cssfreakie

Posted
Posted

keep in mind, most designs for templates can be done without the use of positioning absolute and relative.

instead if you know how to use clear and float your designs will often make more sense. Something to have a look at is a gridsystem which uses just that. Some nice ones out there are yui-grid 960-grid oocss-grid

j.smith1981 Regular Member

j.smith1981

Posted
  • Author
Posted

Yes that makes sense.

 

I mean I have done that before, but never really appreciated fully what I am doing when I come to extend allot of my knowledge, what I am trying to do really.

 

I have done things purely for the way they look, not what they're meant/designed for, like used say <p> to make a heading or something, I mean just as a kind of off the top of my head example.

 

Where I could use say <div id="news">

Then use <h2>News</h2>

</div>

 

Just as an example, just to keep it as structured as possible so to speak.

 

Yes I mean with the grid I am being advised to use firefox 2 plugins Web Developer and Firebug which I already have both, just out of convenience with valid html for which I have been doing my development work in PHP, the html output, trying to keep it as valid as possible, infact due to that plugin, one of them I keep all my html valid for about 99.9% of the time.

 

I mean I think I have nailed XHTML and HTML, since if your not using any XML in a document, why serve your pages up as XHTML? Just doesn't seem logical to me, but I mean a browser tends to not worry too much, it's only IE8 I think doesnt show if the markup (the term I use for HTML, since HTML is not code), it's only code when using jscripts or involves some dynamic content of some sort to what a user has inputted. Sorry IE8 doesnt show some pages due to it not adhering to the DTD part.

 

Like if its a strict and I did say <br and then it would fail to show I think, off complete memory though, can't remember if that actually occured, but in others it would just ignore that tag and move onto the next one like the older browsers did once, it's good for memory though.

 

But again thank you for helping me, really am learning allot from reading this book, going to start going back over what I have already learnt and try to fully appreciate the whole thing about CSS.

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.