Trying to learn to code div tag so that i can make 3 columns

Hello,
I am trying to learn how to work with the code for div's in Dreamweaver.
I have a id for the main container named wrapper that is 900px wide and I have 3 div's inside of it that are just long blocks of type . Each div (#history, #attitudes, #per) is 300px wide with the height falling to accommodate the type. I want then next to each other, and right now they are just one long column with the 3 sections..each have a different background color. Here is the code so far...I am trying to play with the float and positioning but nothing I do works. In the End, it should just be 3 columns of type next to each other. Each column has one header tag for the topic name and the rest is just using the p body tag. can someone help me get the columns next to one another using the code?
thanks!
babs
#wrapper{
width:900;
          background-color:#CCCC66;
#history{
          width:300px;
          height:80px;
          background-color:#FF9999;
#attitudes{
          width:300px;
          height:80px;
          background-color:#ccFF99;
#per {
          background-color:#FFFF99;
          width:300px;
          height:80px;
Here is an image to see them on top of one another....I jusyt want them side by side.....

Copy & paste this code into a new, blank document in code view. Save and preview in browsers.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5 document</title>
<style>
body {
    margin:0;
    padding:0;
    font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
    font-size:16px;
#wrapper {
width: 900px;
margin: 0 auto;
background-color: #CCCC66;
overflow: hidden; /**float containment**/
/**three columns**/
#history, #attitudes, #per {
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
float: left;
width: 33.33%;
min-height: 80px;
padding:12px;
#history { background-color: #FF9999; }
#attitudes { background-color: #CCFF99; }
#per { background-color: #FFFF99; }
</style>
</head>
<body>
<div id="wrapper">
<div id="history">
<h3>History</h3>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi!
Maecenas quis velit nisl, volutpat viverra felis.
Vestibulum luctus mauris sed sem dapibus luctus.
Pellentesque aliquet aliquet ligula, et sagittis justo auctor varius. Quisque varius scelerisque nunc eget rhoncus. Aenean tristique enim ut ante dignissim. </p>
</div>
<div id="attitudes">
<h3>Attitudes</h3>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi!
Maecenas quis velit nisl, volutpat viverra felis.
Vestibulum luctus mauris sed sem dapibus luctus.
Pellentesque aliquet aliquet ligula, et sagittis justo auctor varius. Quisque varius scelerisque nunc eget rhoncus. Aenean tristique enim ut ante dignissim. </p>
</div>
<div id="per">
<h3>Per</h3>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi!
Maecenas quis velit nisl, volutpat viverra felis.
Vestibulum luctus mauris sed sem dapibus luctus.
Pellentesque aliquet aliquet ligula, et sagittis justo auctor varius. Quisque varius scelerisque nunc eget rhoncus. Aenean tristique enim ut ante dignissim. </p>
</div>
</div>
</body>
</html>
Nancy O.

Similar Messages

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

I am trying to connect my Sony DCR-TRV350 to iMovie so that I can make DVD's from family videos. I am having problems getting the video camera connected. Any advice on how to do this?

I am trying to connect my Sony DCR-TRV350 to iMovie so that I can make DVD's from family videos. I am having problems getting the video camera connected. Any advice on how to do this?

What happens when, after you connect your cam, you go to File > Import Media?
But before that, does your cam require you to export your video files upon USB connection? I have a JVC Everio HD and I have to "Export to Library" from the cam's menu first-thing. This was true even in prior iMovie versions.

I don't know my iTunes code. How can I get it so that I can make a purchase?

I don't have my iTunes code. How can I get it so that I can make a purchase?

What iTunes code ? If you mean an iTunes gift card code then are iTunes gift cards available in your country and have you bought a gift card ?

Hi, Im trying to convert a PDF into a weblink that I can post onto social media but dont know how, can you help please?

Hi, Im trying to convert a PDF into a weblink that I can post onto social media but dont know how, can you help please?

You need to upload it to some kind of public server, or file-sharing site (like Google Drive, Dropbox, etc.), and then post the link to it.

Im trying to get an Apple id account so that I can get apps, but all it tells me is "Please contact iTunes support to complete this transaction". What do I do?

Im trying to get an Apple id account so that I can get apps, but all it tells me is "Please contact iTunes support to complete this transaction". What do I do?

Why not do as it tells you to do and contact itunes support?

I've been trying to download an update to Photoshop so that I can import a raw file. Half way through it stops and tells me that to continue I have to close dynamiclinkmanager.exe. I have NO other programmes or applications open. None at all. What should

I've been trying to download an update to Photoshop so that I can import a raw file. Half way through it stops and tells me that to continue I have to close dynamiclinkmanager.exe. I have NO other programmes or applications open. None at all. What should I do? And by the way, how do I can't Adobe, instead of asking others (i. e. doing their job for them)?

close that exe using your task manager (win) or activity monitor (mac).

When trying to download firefox I get a message that says can't download/ connection reset

I ran into some malware over the weekend. Did a system restoration. I've tried several times to download firefox. Each time it runs for a minute or two and then I get a message that says can't download; connection was reset.

You get that message any time you download an executable file. It is safe to open as long as you download from http://www.mozilla.org/en-US/firefox/new/

I keep trying to develop photos but it's saying that it can't open it/find it.

So I've been trying to edit some pictures but it keeps saying that it can't locate the picture. Any ideas? Thanks.

I guess you have moved or renamed the file with the OS.
You will need to relink the file to Lightroom which can be done by clicking the ? on the file and following the menu... If you have a Folder showing a ? the you can do the same with the folder rather than individual files.

Trying to upgrade osx 10.5.8 so that I can use apple tv/facetime etc. mountain lion requires 10.6.8 how can I upgrade my osx? help!

trying to upgrade osx 10.5.8 on my old macbook pro
so that I can use apple tv/facetime etc. mountain lion requires 10.6.8 how can I upgrade my osx? help!
Thank you~

Buy Snow Leopard from the online Apple Store - http://store.apple.com/us/product/MC573/mac-os-x-106-snow-leopard - and update until you get to 10.6.8. Then, if you're computer is able to run Mountain Lion, you'll be able to purchase ML and install it via the App Store.
Good luck,
Clinton

Even after setting system preferences to Never accept cookies and having deleted all cookies, Safari continues to add cookies. I've tried to reset safari but the problem persists. How can make safari Never accept cookies.

I'm having a problem with cookies on Safari.
Even after setting system preferences to Never accept cookies and having deleted all cookies, Safari continues to add cookies. I've tried to Reseting Safari several time but the problem persists. This is occurring under two different user logins one of whom is an administrator the other a standard user. How can I get safari to Never accept cookies? This is a recent problem because in the past it used to work properly. Any idea what might be going on here?

Hi David:
I did read (yesterday in another thread) about a similar problem. I cannot test it myself as I accept cookies (from sites I visit) and do not want to delete all of mine for a test.
I do not know whether it meets your requirements, but you could turn on private browsing. I use that (or Microsoft's variant on IE) when I use public computers.
Barry

HT201365 I am trying to turn off find my iphone so that i can restore and back up the iphone. the phone has been disabled and when I try to restore it, it tells me i can't restore it until i take off the find my iphone options

How do I turn off "find my iphone" from the computer?
The phone was disabled and I cannot restore and back up until I turn off this feature

You can access iCloud.com on a computer to turn it off.
http://support.apple.com/kb/PH2702

I have an external hard drive and i am trying to erase it because its full so that i can continue to use it to back up my iMac help

Hi Guys
Ok I have an external haddrive that is I guess full. Can I erase it so I can continue to use it for backing up my iMac?

The short answer is yes, but if its capacity is inadequate for the source volume's contents it will still be too small.

Hi I'm trying to find a simple bit of freeware that I can use to image map for creating hotspots on a website. Any ideas?

Hi
I'm wanting to create a pretty complicated image map for a web page so it'll be lot's of polygons. Does anyone know of a good bit of freeware I can use that will help me work out the coordinates for the image maps?
Thanks
Neil

You could do this in any text or html editor.t I imaging you want a click and drag capability when selecting the areas of the image map. Try looking at some of these. https://www.google.com/search?q=image+map+create+apple+mac

Trying to identify which Clip I have so that I can start with Rockbox

Hi, I have this Clip (Amazon), but it's hard to find out which model it is as regards what I should choose when installing Rockbox. I'd be grateful if anyone could tell me. Also I bought a 32gb Sandisk memory card (Amazon again) for the Clip, and am curious that the Rockbox installer lets me choose that as a potential target for the install. Maybe it's a Mac thing, but the memory card mounts as a separate volume when you connect the Clip via USB. My other big question is, once I have identified the model, where can I find the boot file that the installer needs to start the Rockbox install? The pop-up in Rockbox pointed me here, so I guess I'm following a familiar path (!), but I can't see a pinned post about it anywhere. Would be immensely grateful for a clue.

twoshedsmcginty wrote:
Hi,
I have this Clip (Amazon), but it's hard to find out which model it is as regards what I should choose when installing Rockbox. I'd be grateful if anyone could tell me.
Also I bought a 32gb Sandisk memory card (Amazon again) for the Clip, and am curious that the Rockbox installer lets me choose that as a potential target for the install. Maybe it's a Mac thing, but the memory card mounts as a separate volume when you connect the Clip via USB.
My other big question is, once I have identified the model, where can I find the boot file that the installer needs to start the Rockbox install? The pop-up in Rockbox pointed me here, so I guess I'm following a familiar path (!), but I can't see a pinned post about it anywhere.
Would be immensely grateful for a clue.
As your linked page states as to the product, you have a Clip+.
It is relatively easy to install Rockbox, using the Rockbox Utility. Simply follow the instructions (which are up-to-date, as versus in other locations). Note: you do need to read about what you need to do, to know what you need to do.
http://www.rockbox.org/wiki/RockboxUtility
I also first recommend that you first look at the Rockbox manual, for an overview of the install process.
http://download.rockbox.org/daily/manual/rockbox-sansaclipplus/rockbox-buildch2.html#x4-60002

Trying to learn to code div tag so that i can make 3 columns

Similar Messages

Maybe you are looking for