Trying to make sense of div tags and css

i know that i am a few years late here, but i am looking ot make the migration from using tables and switching over to div tags and css. i have watched a few tutorials on you tube and am trying to understand everything.
please tell me if this is correct. a div tag is basically a table and css is what is used to style that div tag to meet your needs, is this a correct assumption??
if you go to my current site www.tankinz.com you can clearly see that the site is made up of tables, basically these boxes or tables contain a different item or package that a customer can click on and buy. by using div tags and css would each of these boxes, or tables be their own div?
sorry for sounding a bit moronic but i am trying to make sense of all of this.
please help!

Markup (html) contains elements, such as html, body, h1, h2, p, span, div and so forth. Hence a <div>-tag is part of an element; the other part being the </div>-tag.
The element structure of many web sites is basically (using HTML5 element names)
html
     head
     body
          header
          nav
          aside
          article
          footer
These elements can be positioned and styled using style rules (css). Depending on the style rules, the above structure can take on many different styles, without ever touching the markup.
Have a look here for a simple two-column layout using the same structure as above http://www.456bereastreet.com/lab/developing_with_web_standards/csslayout/2-col/

Similar Messages

DW Beginner - Tables, Div Tags and CSS Confusion

Hi,
I am a beginner to DW. The layout I am designing is as follows:
First I have an overall "container" on the outside of my layout which I called "wrapper" and I made it using a div tag.
Next I made a table within or right after this "wrapper" div tag, which I called my "navbar".
After this table I made another table named left and right column (r:1 cz:2).
And lastly, another table, called "footer".
Now, I made a CSS for the div tag, no problem. But, when I go to make CSS for the tables, that's where it gets confusing.
For example, I went into my "navbar" table, selected on the "trail" <td>, and then tried to create a CSS for this particular table.
Problem: Why when setting my font or background or any other setting, are the other 2 tables changing also if I only assigned this specific area for the CSS navbar table? Am I selecting the wrong "trail" or is it because it is still entrapped somehow in the "wrapper" div tag, so it won't allow my new CSS settings? I would appreciate any help. This can really get confusing fast, especially for us beginners trying to learn.
Thanks,
S

Since you're new to DW, I'm assuming you're new to HTML and CSS, too. So start by learning code basics first and you'll have a much easier time understanding DW.
Begin here:
HTML & CSS Tutorials - http://w3schools.com/
CSS layouts are much more flexible than tables. Below are some example of CSS layouts (no tables needed)
http://alt-web.com/TEMPLATES/I-page-with-floats.html
http://alt-web.com/TEMPLATES/2-col-fixed-layout.shtml
http://www.tjkdesign.com/articles/one_html_markup_many_css_layouts.asp
From Tables to CSS Web Design Part 1 -
http://www.adobe.com/devnet/dreamweaver/articles/table_to_css_pt1.html
From Tables to CSS Web Design Part 2 -
http://www.adobe.com/devnet/dreamweaver/articles/table_to_css_pt2.html
Good luck,
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb
www.alt-web.blogspot.com
How To get Help Quickly in DW Forums
http://forums.adobe.com/thread/470404

Help needed creating vertical bullet list using div tag and css

Hi,
I think there is something quite fundamental that I'm missing when using div tags - I seem to keep running into problems with them.
I'm trying to create a vertical bullet list. It works fine when I try the code on its own as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">

</style>
<head>
</head>
<body>
<div id="techlistcontainer">
<ul id="techlist">
          <li>Java Messaging Service (JMS)</li>
          <li>Message Driven Beans </li>
          <li>Remote Session EJBs with multi-threading</li>
          <li>Message Oriented Middleware(MOS) such as Websphere MQ series, Mercator with SAP/ERP</li>
          <li>XML messaging</li>
          <li>CORBA (Common Object Request Broker Architecture), RMI (Remote Method Invocation)</li>
    </ul>
</div>
</body>
</html>
http://www.pa-solutions.co.uk/vertical_list.html
When I insert that into my site template page, its all over the place:
http://www.pa-solutions.co.uk/development.html
I've put the css code into a seperate file http://www.pa-solutions.co.uk/pas.css - I get the same results when its embedded into the html doc.
Please help before I pull all my hair out.
Thanks,
Phil.

Unless you know what you're doing with absolute positioning, avoid absolute positioning! Absolute positioning actually takes an element out of the normal HTML document flow and positions it absolutely in relationship with it's first parent with a position other than static - for details read the HTML specs at the W3C.
Ideally you should use the normal HTML document flow. Divs are block level elements meaning that they act like blocks that take up a height (determined by children content) and width (the full width of the page or it's parent container, unless you tell it otherwise).
For your CSS try this:
#techlistcontainer {
    width: 75%;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 30;
    padding-top: 0;
    padding-right: 0;
    padding-bottom: 0;
    padding-left: 30;
How does that work with your templates?

Trying to make sense on how and if RBAC and MOAC could work together

Hi All,
We upgraded from 11.5.9 to R12.1.1 in Nov-2009.
Since the time we have upgraded to R12, we are trying to make sense as to how and if RBAC and MOAC could work together.
The use case is as below:
*11i Days*
US Accountant - accesses ‘AR superuser US’
Canada Accountant - accesses ‘AR superuser Canada’
France Accountant - accesses ‘AR superuser France’
Spain Accountant - accesses ‘AR superuser Spain’
North America Financial controller - Switches between 'AR superuser US' and 'AR superuser Canada'
European Financial controller - Switches between 'AR superuser France' and 'AR superuser Spain'
CFO - Switches amongst 'AR superuser US','AR superuser Canada', 'AR superuser France' and 'AR superuser Spain'
Now in R12- (Wow there is MOAC!)
US Accountant - accesses ‘AR superuser US’
Canada Accountant - accesses ‘AR superuser Canada’
France Accountant - accesses ‘AR superuser France’
Spain Accountant - accesses ‘AR superuser Spain’
North America Financial controller - accesses 'AR superuser North America'
European Financial controller - accesses 'AR superuser Europe'
CFO - accesses 'AR superuser Global'
With R12 now there are 3 additional responsibilities.
We have (like most of the other EBS customers) custom responsibilities and so there is maintenance.
More the responsibilities more the maintenance...More the SOD issues.
To prevent creating new responsibilities, we could use the ‘MO: Security Profile’ at the user level BUT that would mean that now these users would have access to multiple OUs for all the responsibilities...that is not good.
What-If: There is only 1 responsibility 'AR SuperUser' and somehow using RBAC, roles are created and assigned to users so that they only have access to specific OUs.
Apparently, MOAC works based on MO:Security Profile that is something that RBAC cannot control.
Am I missing something...RBAC seems to be no good?
In PROD(R12.1.1)- We are expecting that we would end up creating 100+ new responsibilities since we have many shared services users and they all want to benefit from MOAC...Appreciate, if you could please help us understand how we can prevent these 100+ new responsibilities from getting created?
Thanks
Rahul Gupta

Hi Rahul,
your question is quite interesting. I did a lot in the area of RBAC to understand the background.
RBAC mainly allows you to
- group responsibilities
- build hierarchies
- manage low level data access (via VPD)
- Grant permissions (new with R12)
Unfortunately you can't control profile options via RBAC. Therefore, the MO:Sec Profile has to stay on responsibility level. I was playing with the alternative to put this profile option on user level, but also in this case the number of maintenance steps will stay the same.
I would like to share a document with you, what's your email (or search my name in linkedin)?
kr
Volker Eckardt

Why does this come up when trying to insert a fluid div tag

Can someone tell me please why i get this when trying to insert a fluid div tag on my page thanks in advance mark @charset "utf-8"; /* Simple fluid media Note: Fluid media requires that you remove the media's height and width attributes from the HTML http://www.alistapart.com/articles/fluid-images/ */ img, object, embed, video { max-width: 100%; } /* IE 6 does not support max-width so default to width 100% */ .ie6 img { width:100%; } /* Dreamweaver Fluid Grid Properties ---------------------------------- dw-num-cols-mobile: 5; dw-num-cols-tablet: 12; dw-num-cols-desktop: 20; dw-gutter-percentage: 15; Inspiration from "Responsive Web Design" by Ethan Marcotte http://www.alistapart.com/articles/responsive-web-design and Golden Grid System by Joni Korpi http://goldengridsystem.com/ */ /* Mobile Layout: 480px and below. */ .gridContainer { margin-left: auto; margin-right: auto; width: 97.3913%; padding-left: 1.3043%; padding-right: 1.3043%; } #LayoutDiv1 { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #LayoutDiv2 { clear: both; float: left; margin-left: 0; width: 100%; display: block; } /* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */ @media only screen and (min-width: 481px) { .gridContainer { width: 98.913%; padding-left: 0.5434%; padding-right: 0.5434%; } #LayoutDiv1 { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #LayoutDiv2 { clear: both; float: left; margin-left: 0; width: 100%; display: block; } } /* Desktop Layout: 769px to a max of 1232px. Inherits styles from: Mobile Layout and Tablet Layout. */ @media only screen and (min-width: 769px) { .gridContainer { width: 99.3478%; max-width: 1232px; padding-left: 0.326%; padding-right: 0.326%; margin: auto; } #LayoutDiv1 { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #LayoutDiv2 { clear: both; float: left; margin-left: 0; width: 100%; display: block; } }

Firefox the web browser (from mozilla.org) nor Mozilla will NOT send any form or viruses, malware or toolbars into Firefox as it would hurt Mozilla far too much for any little gain.
You seem to have the current Release Firefox 30.0 so there should be no more updates until Firefox 31.0 unless a chemspill update (30.0.1) was warranted in meantime for security and or stability fixes.
So you are considering filing a lawasuit for Firefox prompting you for a Firefox update?.
There are other reasons for connections like say looking updates for any Extensions and Themes you have installed, updates to a blocklist for Extensions and other safe things like mentioned at http://kb.mozillazine.org/Connections_established_on_startup_-_Firefox

Very new to photoshop I am trying to make changes to a photo and set it up as a smart object but after selecting smart object, the checkerboard appears and my photo dissppears

Very new to photoshop I am trying to make changes to a photo and set it up as a smart object but after selecting smart object, the checkerboard appears and my photo dissppears

Hello, thank you so much for your response! Here are some screenshots of my steps taken

Trying to make a purchase on itunes and keep getting prompted to verify account information, when I do that, it says to fix errors, then to contact apple support, any ideas or know how to fix this?

Trying to make a purchase on itunes and keep getting prompted to verify account information. I've done this and when i click done, it says to fix errors; i repeat the process then it says to contact apple support. Any ideas or other experiences with this? I've had this happen before and it got resolved after i called them and it took a few days, not very convenient. The same thing happened when I was just trying to update my account info with a new billing / account address.
Thanks

You will need to do what it says, contact iTunes Support. These are user-to-user support forums, if you thought you were contacting Apple by posting here. Go here:
http://www.apple.com/emea/support/itunes/contact.html
to contact the iTunes Store.
Regards.

I'm trying to make an in app purchase and it keeps telling me to come to the support page but I can't figure out why it won't let me do it

I'm trying to make an in app purchase and it keeps telling me to come to the support page but I can't figure out why it won't let me do it

And I have gone to the support and it was no help

HT5312 im trying to make a purchase on itunes and its asking for my security question and i dont remember them its been years since i made this account how can i reset them

im trying to make a purchase on itunes and its asking for my security question and i dont remember them its been years since i made this account how can i reset them

You need to ask Apple to reset your security questions; ways of contacting them include clicking here and picking a method for your country, phoning AppleCare and asking for the Account Security team, and filling out and submitting this form.
(98991)

HT4009 I'm trying to make a in app purchase and it refers me to apple support. What do I do?

I'm trying to make a in app purchase and it refers me to apple support. What do I do?

Contact iTunes Customer Service and request assistance
Use this Link > Apple Support iTunes Store Contact

HT4009 I am trying to make an in-app purchase, and it will not let the transaction go through after I click "buy." How do I fix this?

I am trying to make an in-app purchase, and it will not let the trasaction go through after I click "buy." How do I fix this?

By 'not letting the transaction go through' you mean ... ?
If you are getting a message to contact iTunes Support then you can do so via this link and ask them for help (we are fellow users here on these forums, we won't know why the message is appearing) : http://www.apple.com/support/itunes/contact/ - click on Contact iTunes Store Support on the right-hand side of the page, then Purchases, Billing & Redemption
If it's a different problem ... ?

HT204053 I'm Trying to make an in-game purchase and have been prompted to contact iTunes support to complete this transaction.

I'm Trying to make an in-game purchase and have been prompted to contact iTunes support to complete this transaction.

You need to contact support then.
http://www.apple.com/support/itunes/purchases/

I am trying to make a calendar in iPhoto and I would like the month to start on Sunday , not Monday. Is that possible and if so how can i do that???? thanks.

i am trying to make a calendar in iPhoto and I would like the month to start on Sunday , not Monday. Is that possible and if so how can i do that???? thanks.

What system and iPhoto version are you running? What theme are you using.
All of my calendars do have the month starting on Sunday, Don't know of any way to change it. Where are you located?
How do you have your Calendar application's preferences set to, Sunday or Monday start of week?

How do i center a div tag using css?

I am trying to learn css layout.
Starting with a blank page, I insert a couple of AP div tags and locate them where i want.
When i preveiw them in a browser, i notice that they are left justified. This is what i expect as they are Absolute positioned.
I would like them to be centered as a group. Creating a layout and centerring it on the browser window seems like a basic task.
I tried to add a div tag wrapper and center that but i cannot find where in the css panel is there any reference to center.
seems simple enough, im stumped.
Thanks
Jerry
P.S. I know as soon as i post this, i'll find the answer.

>>I tried to add a div tag wrapper and center that but i cannot find where in the css panel is there any reference to center.
Yeah that is the right approach and you can center by using following style:
#wrapper{
margin:0 auto;
Your ap divs will then absolutely position themselves within this wrapper div which acts as parent.
Regards,
Vinay

Can you place an image in a div tag and then add type over top of it?

I told someone in class lastweek that I wanted to be able to
place type over an image. They said you can just add the image into
the div tag as a background image, which will allow you to then
type over it if you like. How is this done? I have tried and
failed. I have an image that is 200x590 going down the left side of
my page. I want to run type over it, and keep the image consistent
on every page, but change the header and type. I've seen this in
several sites. How do you do this with the div tag box model method
of building a page. Can I insert an image into the div and then run
type over it. What does the code look like?

Here's an example of using a css and a background image to a
table cell...
sample principle for a div
#div {styles go here{
http://tinyurl.com/yqeptp
You may also want to go through the beginner css tutorials at
the Adobe
site:
http://www.adobe.com/devnet/dreamweaver/css.html
(pay attention to the ones
by Adrian), beginner moving onto to creating full css
layouts.
Hope this helps :-)
Nadia
Adobe® Community Expert : Dreamweaver
CSS Templates |Tutorials |SEO Articles
http://www.DreamweaverResources.com
~ Customisation Service Available ~
http://www.csstemplates.com.au
Forum Posting Guidelines:
http://www.adobe.com/support/forums/guidelines.html
>I told someone in class lastweek that I wanted to be able
to place type
>over an
> image. They said you can just add the image into the div
tag as a
> background
> image, which will allow you to then type over it if you
like. How is this
> done?
> I have tried and failed. I have an image that is 200x590
going down the
> left
> side of my page. I want to run type over it, and keep
the image consistent
> on
> every page, but change the header and type. I've seen
this in several
> sites.
> How do you do this with the div tag box model method of
building a page.
> Can I
> insert an image into the div and then run type over it.
What does the code
> look
> like?
>

Trying to make sense of div tags and css

Similar Messages

Maybe you are looking for