IE7 seems to "hide" text in DIV tags

Hi Guys
How can I solve this? I would like to have the text horizontally and vertically centered in the DIV-tags. It goes quite well but in Internet Explorer 7 it only shows half of the text.
How to solve this?
And an additionnal question: I would like the lowest of the three buttons to be nearly pasting to the bar you can see under it. In Internet Explorer, that goes smoothly, but in Google Chrome or Firefox there's a lot of space between the button and the bar?
Thanks!
Bob

I'm not certain what you're using now, but I would write the css code something like this...
.centered {
     font-family:verdana;
     font-size:12px;
     font-weight:bold;
     line-height:20px;
     text-align:center;
     width:150px;
     height:20px;
     background-color:purple;
     border-radius:5px;
Then the html would look like this...
<div class="centered">some text</div>
It's hard to say what's going on with yours though without a link to the actual page.

Similar Messages

Text in Div tag question

hello Dreamweavers.
I have made a Div Tag and placed and image within it. Im also copy/pasting lorum ispum text in the div tag.
what id like to know is,why does DW put the text down the bottom and not from the top where the red arrow is.
So how can I add text from the top of the image?
thank you.

Try the following
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
.banner {
    width: 600px;
    margin: auto;
.banner img {
    display: block;
    float: left;
    margin-right: 15px;
.banner p {
    margin-right: 15px;
.banner p span {
    font-weight: bold;
</style>
</head>
<body>
<div class="banner"> <img src="_images/top_back8.jpg" alt="img">
<p><span>Lorem Ipsum</span> is the exploitation of core competencies as an essential enabler, measure the process, not the people. Building a dynamic relationship between the main players. As knowledge is fragmented into specialities an important ingredient of business process reengineering whether the organization's core competences are fully in line, given market realities. The three cs - customers, competition and change - have created a new world for business highly motivated participants contributing to a valued-added outcome.</p>
</div>
</body>
</html>
I like to keep it simple and restrict the use of ID's

How do I hide an ap div tag or layer in order to access the table or image under it?

Since Dreamweaver CC 2014 has gotten rid of the layers features I can't find out how to 'hide' my existing layers made in an older version in order to select the images or tables under it. I'm not a professional web designer, I just do this for my own business' websites and can't afford to redesign the whole thing at the moment but I need to edit a few things. Basically, I want to extend the page by replacing the short band of dark green with a larger one, and add more text to the FAQ. If I really need to I guess I can add a link for an additional page but I'm trying to avoid that. This is the page I am trying to edit, if it helps: Fancy Fairy Wings Frequently Asked Questions

APDivs are contra-indicated in modern web design. But.... you can turn off CSS in DW's Design View.
Go to View > Style Rendering > un-tick Display Styles.
This will disable styles while you work but it won't effect Live View or Preview in browsers.
The alternative is to stay away from positioning and table layouts. Learn to use modern web design methods:
CSS Box Model
CSS Margins
CSS Floats
CSS Padding
CSS Borders
If you're not learning new stuff, you're falling hopelessly behind the curve. That's not good for a business. Just saying...
Nancy O.

Why do the coordinates always seem to change with AP DIV tags

Hello,
I have been learning Dreamweaver and got to a chapter about Drawing AP DIV's. Seemed like a great idea, despite some of the known downfalls, older browsers, trouble centering etc....but my question is more about the drawn element itself on the page. It doesn't seem to hold it's Top and Left Numbers inthe property inspector. I mean, it doesn't move, but it seams every time I check the coordinates to maybe align another one to right of it or below it, the Top and Left numbers keep changing. When I put back in my coordinates, it doesn't seem to move, even though the numbers are different. Is it me? or is this just a flaky think in the program? Too knew to it to know it's quirks.
thanks!
babs

iBabs2 wrote:
I did a chapter on Layout Tables and liked them much better ;-)
Tables are not much better than using AP Divs. If you're referring to Layout Mode, start thinking again. Layout Mode was removed from Dreamweaver CS4 because it created the most complex, inaccessible code.
Many people still use tables for layout, but if you're just learning Dreamweaver, you would be better advised to learn how to use CSS for layout. Dreamweaver CS3 and CS4 have 32 prebuilt CSS layouts that provide a rock-solid foundation for most basic layouts.
We are all experienced in the printing programs, so we live via coordinates...
The similarity between print and the web is purely superficial. A printed page is fixed. A web page is not. People view on different browsers, and at different monitor resolutions. Some view with their browser fully expanded. Others, like myself, resize the browser to occupy just part of the monitor.
The language of web design is CSS. It's not something you can learn overnight, but it's essential for learning how to build modern, standards-compliant sites. You'll find some useful tutorials at http://www.adobe.com/devnet/dreamweaver/css.html.
As for the coordinates not updating correctly in the Property inspector, the PI can sometimes be hinky when calculating position, particularly if the computer doesn't have a lot of RAM. The other possibility is that you nudged the border of the AP Div. It's very easy to do without realizing.

Hidden and visible div tags, transparence and links - HELP....

I am showing different products in div tags that are controlled by simple javascript. I would like to add text links to open a new div tag about the related products, but also hide the original div tag that the link is placed on.
Please check this page out
http://www.aestheticgroup.fr/New/Inex/Inex_lipoAspirationR.html
and then click on the image for
CANULES D’ASPIRATION PROXIMALE
and then click on the text link:
manche BD 300 10
You will understand my problem. I'm trying to make this div tag (Canule d’aspiration Proximale) disappear instead of having them stack one on top of the other.
Do you have an idea of how I can add multiple functions to one click (close the div tag and open a new one at the same time)?
Thank you for your help!
Sooooophie

Hi Sophie,
I downloaded your site and yes, there was a typo in the script...
The script should read...
var curOverlay = null;
function overlay( aOly) {
var el = document.getElementById(aOly);
if (curOverlay) curOverlay.style.visibility = "hidden";     // THIS LINE HAS CHANGED
if (curOverlay != el) {
    el.style.visibility = "visible";
    curOverlay = el;
else
    curOverlay = null;
I also realize that wherever you call an overlayXX function that you are currently using, you'll need to replace it with a call to overlay('overlayXX')
I needed to add this to your onclick attribute for the close button... I tested this and it seems to work for the existing page.
here are the snippets from your page that I changed
      <div id="Groups02"><a href='#' onclick='overlay("overlay02")' onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image21','','images/LipoReutilisable02B.jpg',1)"><img src="images/LipoReutilisable02.jpg" name="Image21" width="170" height="120" border="0" id="Image21" /></a>
        <p>CANULES D’ASPIRATION <br />
        UN ORIFICE</p>
      </div>
and for the close button:
   <div id="close02"><a href='#' onclick='overlay("overlay02")' onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image43','','images/close.jpg',1)"><img src="images/close02.jpg" name="Image43" width="72" height="20" border="0" id="Image43" /></a></div>
You'll need to change this wherever you reference each overlay, in this case, it was for overlay02. The good news is you'll only need this function and not one function per overlay as you have now.
As I said in the previous post, I am off on vacation for a little over a week.
Good Luck!

Problem with Flash in a Hide/Show Div Tag

What is the best way to handle Flash files on an HTML page
within a <div> tag you hide and show (via javascript). It
seems to reload when you hide and then show the <div> tag
when using display: block.
Positioning instead (move offscreen)?
Visibility?
Other?

I would say off-screen is going to give you the best
cross-platform performance. I've found visibility show/hide
prevents the swf from working in IE while hidden much like you
alluded to. Of course in mozilla browsers hide doesn't behave the
same way.

Div tags and text decorations

Hello,
Is there a way to control the a:link text decoration/color within a div tag? It seems as thought the Page Props is the only place, hence controlling everything on the page.
Thank you!!!!!!

Okay so I go to a doctor's aqppointment and look at all the action on this thread.
Just to flesh this out a bit more.
I'd only add one other thing you may not be aware of (not you Murray, rather Esther). You can also have links appear different based on the part of the page they are on. If you have a div, as one example, on the page, you can style all the links in that div, to which you have applied an id="oneID" thusly:
div#oneID a:link {
     color:red;
     text-decoration:none;
     border-bottom: dotted 1px green;
and in another part of the page, say in an unordered list with an id="anotherID":
ul#anotherID a:link{
     color:blue;
     text-decoration:overline;
And of course Murray, you were correct, as usual, in divining the OP's query.
E. Michael Brandt
www.divahtml.com
www.divahtml.com/products/scripts_dreamweaver_extensions.php
Standards-compliant scripts and Dreamweaver Extensions
www.valleywebdesigns.com/vwd_Vdw.asp
JustSo PictureWindow
JustSo PhotoAlbum, et alia

Div tag - how do you keep text within box

I have looked at many of the sample documents where the
columns, div boxes, etc are layed out for you. Margins and padding
are set. However it seems when I type text within the boundry I can
just keep typing clear outside the boundries. Shouldn't the text
auto-wrap to stay within the box. What good does it do to have the
div tag settings if they don't enclose the text for you? What am I
missing here.

Put a space in what you are typing, please. See what happens.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"SnowmanTruckee" <[email protected]> wrote
in message
news:gkth4q$m1a$[email protected]..
>I have looked at many of the sample documents where the
columns, div boxes,
>etc
> are layed out for you. Margins and padding are set.
However it seems when
> I
> type text within the boundry I can just keep typing
clear outside the
> boundries. Shouldn't the text auto-wrap to stay within
the box. What good
> does
> it do to have the div tag settings if they don't enclose
the text for you?
> What
> am I missing here.
>

Rich Text Editor functionality for a DIV tag in a publishing page in SharePoint online

Hi,
We are having a requirement where we need RTE behavior of SharePoint 2013 Rich Html Field for a custom DIV. The scenario goes like this:
1. I have a publishing page
2. I dropped the content editor web part and to that content editor web part I will point to an HTML file that needs to be rendered in that content editor web part
3. I have one DIV in the above mentioned HTML files and I want that div to be editable and I need to RTE options for that DIV.
How to accomplish the above behavior?

Hi,
According to your post, my understanding is that you wanted to create html rich text editor for a DIV tag in a publishing page in SharePoint online.
You can create your own Rich Text Editor.
Here are some great blogs for your reference:
An Example to Use HTML Rich Text Editor
Example: Using the Editor's instance
Rich Text Editor control in SharePoint 2010
Regarding SharePoint Online, for quick and accurate answers to your questions, it is recommended that you initial a new thread in Office 365 forum.
Office 365 forum
http://community.office365.com/en-us/forums/default.aspx
Best Regards,
Linda Li
Linda Li
TechNet Community Support

CAS - Write text of certain html div tag to new attribute

Hi,
Is it possible with CAS to extract text from certain HTML div tags to new attributes. So let's say we have tags in a specific "Tags" div and store that text in a new attribute of that record?
Thanks!
Marco Snels

Hey Marco,
I'd need to try this out a bit more since I have never built a custom CAS web crawler parser plugin. Here's what I know based on your questions:
1) If I understand it correctly the name after the METATAG_PROPERTY_NAME_PREFIX will be the attribute name (?) so in this case Endeca.Document.HTML.MetaTag (?)
Correct. You will want to change this in the code to something more meaningful to what you're trying to parse out of the <DIV> you're interested in.
2) And I think that I have to change the FILTER-HTMLMETATAG name after the getParseMeta().add line but I don't know to which value?
Accorinding to the WebCrawler guide this sample attribute was only added so you could see a new property on each output record to prove that this custom plugin was being executed. It can be removed for your custom plugin. That said, you're going to have to change what you're pulling out out the parser object. In the sample, they're pulling out the MetaTags (via an Endeca extension of the nutch parser), which you don't care about for your need. (e.g. HTMLMetaTags tags = parse.getData().getMetaTag();). Instead, you'll need to pull out the Content (e.g. parser.getData().getContentMeta()). You may want to google for nutch parser usage to get examples on how specific HTML elements can be found.
HTH,
Dan
http://branchbird.com

Div tag with text and image verticaly centered

I am having a problem with vertically aligning an image with
a text line in a div tag using an external CSS file.
Any help would be appreciated

quote:
Originally posted by:
Night_Ripper
You can simply do this:
ProdDimensions img {vertical-align:middle;}
Or you can use an un-ordered list that has your arrow
embedded as a background image, something like this:
.ProductList ul {list-style-image:
url(Arrow.gif);list-style-position:outside;list-style-type:none;text-align:left;}
.ProductList li {margin:0;}
wrap your unordered list around a div with the class
ProductList (or whatever you want to call it) and it will display
with the arrows in the middle of the text.
Another way to do it would be to set a background image on
ProdDimensions class like this:
background: url(Arrow.gif) left center
no-repeat;padding-left:21px;
That will simply put a background image to the left middle of
your div, the padding will ensure the text is not on top of the
arrow.
I used your idea of using the arrow as the div bg and it
worked like a charm.
Thank you very much for your help!

How do I overlap text in a Div Tag over an Image

Hi,
I have a large image which I would like to set as as border around the page.
Please see www.touchw1.com, it is the grey border with the 3 archways on it that I would like as a border. At present, everything on this screen apart from the contact details at the bottom are saved as one JPEG. I saved it like this as I don't know how to set that border as a border and then insert other div tags over, or in it? Can anyone help??
Thanks

Create a 'wrapper" and 'footer1' <div>
<div id="wrapper">
</div>
<div id="footer1">
</div>
Create some css:
#wrapper {
border: 1px solid #333;
border-bottom: none;
width: XXXpx /* width you require */
margin: 0 auto; /* centers wrapper horizontally in browser window */
#footer1 {
background-image: url(archway.gif); /*archway image plus borders */
background-repeat: no-repeat;
height: XXpx /* height of background archway image */
width: XXXpx /* width you require */
margin: 0 auto; /* centers footer1 horizontally in browser window */
Then start adding content to the 'wrapper' <div>. Insert your logo into a <h1> header.
<div id="wrapper">
<h1><img src="images/logo.jpg" width="XXX" height="XXX" alt="TouchW1 Sales and Press Agency - Central London" /></h1>
<p>TouchW1 is a newly created niche agency that specialises in all aspects of sales management, press and licensing, based in the heart of Central London</p>
</div>
<div id="footer1"></div>
Move h1 header into position in the 'wrapper" <div> with css:
h1 {
margin: XXpx XXpx XXpx XXpx; /* top, right, bottom, left */
padding: XXpx XXpx XXpx XXpx;
Do the same with the paragraph tag
#wrapper p {
margin: XXpx XXpx XXpx XXpx; /* top, right, bottom, left */
padding: XXpx XXpx XXpx XXpx;
Add rose as background to 'wrapper' <div>
#wrapper {
border: 1px solid #333;
border-bottom: none;
width: XXXpx /* width you require */
margin: 0 auto; /* centers wrapper horizontally in browser window */
background-image: url(rose.jpg);
background-position: top right;
background-repeat: no-repeat;
Hummm that its really....add a 'footer2' <div> for the address line

How do you position text in a div tag to be in the center vertically?

Can someone help? I am struggling to convert from being dependent on tables to design sites to using all css and divs. Anyway, in my practice file, i made a header that is styled to be 50 pixels tall. The type in the header goes to the top. I am used to having type default to to the left and positioned vertically in the center they way type "works" when placed in a <td>. What am I not "getting?" I would like to know that if I change the css for the header region from 50 to another value that the type will always be positioned where I want it.
thanks in advance for any suggestions. Maybe the picture I've attached will better explain what I'm talking about. Oh, and I've also attached the html file

HudsonSwimmer wrote:
Can someone help? I am struggling to convert from being dependent on tables to design sites to using all css and divs. Anyway, in my practice file, i made a header that is styled to be 50 pixels tall. The type in the header goes to the top. I am used to having type default to to the left and positioned vertically in the center they way type "works" when placed in a <td>. What am I not "getting?" I would like to know that if I change the css for the header region from 50 to another value that the type will always be positioned where I want it.
thanks in advance for any suggestions. Maybe the picture I've attached will better explain what I'm talking about. Oh, and I've also attached the html file
I'm afraid you'll have to starting looking at things differently. Css cannot yet vertically centre anything in a <div> container reliably.
About as good as it gets is one line of text (see code below) using the line-height attribute AND you need to give the <div> a height too which is also likely to lead to other problems. So forget it. You can use padding and margin to push it into a 'visual position vertically centered' in your browser but there is no guarantee that others with different browser set ups will be seeing it the same.
<!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">
#vertCentre {
height: 300px;
background-color:#FF0;
line-height: 300px;
text-align: center;
p {
font-family: verdana, helvetica, arial, sans-serif;
font-size: 12px;
margin: 0;
padding: 0;
</style>
</head>
<body>
<div id="vertCentre"><p>This is some vertically centered text</p></div>
</body>
</html>

Centering a DIV Tag

Hi,
am having trouble / don't have a clue how to centre a div tag
to the center of the page? Can someone point me where am going
wrong. Here is the html code:
thanks in advance
hammer.

>>I think you'll find significant disagreement here
about the following
Yes, here, I definitely will find significant disagreement.
But I'm very
much of the opinion that publishing to the web is for the
masses, not just
for you folk with the time, motivation, and expereince to
deal with the
range of issues relating to css layout. The simplicity of
tables far
outweighs the gains of css layout at this point in time.
>>There is nothing worse than a morass of nested tables
spanned to death,
>>not
only for you as the maintainer of the site, but also for the
browsers, some
of which simply cannot render such pages. CSS layouts do not
have these
problems.
Here you are wrong. I would actually revese that whole point.
It is css
layout that are notorious fo rbrowsers laying out or not
rendering properly.
Tables never came close to having such issues. Even nested
tables, one level
deep, are perfectly fine.
>>some
of which simply cannot render such pages. CSS layouts do not
have these
problems.
Politely, where the heck have you been living these last few
years!!
>>Future maintainence, bandwidth usage, and simplicity
of layout are big
benefits of using CSS as opposed to tables.
simplicity of layout??? Again, I think you are missing the
argument here.
Its almost a given that tables are simpler to use for layout.
Almost all
books on teh topic agree, but point out the long term benefit
of css layout
despite the added complexity. So please don't use the
'simplcity' as an
argument here. CSS layout is the most intimidating and hard
to fathom thing
for most beginners, not just the new syntax but all the
nonsensical
(seeming) twists and turns that must be taken to get it to
work properly -
not to mention they are buggy as hell. Tables? They don't
come close to
being as nasty as CSS layout as it is today.
>>Everyone here (I think) agrees that if tables work
better for you, then use them. BUT use them correctly if you
are going to
do that. It's pretty simple, really....
Agreed. I personally use tables for average sized websites
which have to be
edited/maintained by general staff - you can teach tables oto
people inside
of amorning to a day. You'd need weeks to months to teach
enough CSS layout
to a layman and even then he'd think it sucks. I will be
using css for
layout about two browser versions from now.
I don't see the sense on jumping on a technology that, at
every second turn
you get, go here for this hack, do this to get around that
problem, IE
cannot do this so use this javascript fix, oh it doesn't work
while looking
at in dreanweaver but it will work in the browser, blah blah
blah...its
enough to put someone off web design for life.
I came to the web initially becuase I was amazed at how much
I could do with
so little knowledge - it was awseome. I think this should
still happen to
people today - it's quite empowering. I think the reality is
a lot more folk
get disheartned, confused and simply don't run with it. We
scare the crap
out them with css layout.
"Murray *ACE*" <[email protected]> wrote
in message
news:[email protected]...
>I think you'll find significant disagreement here about
the following -
>
> * CSS for layout is simply not there yet
> * Its only the accesibility issue which tables lose
points for
> * Possibly, the only benefit of css layout is that it
can be centrally
> goverened through a linked style sheet, but even this
can be done with DW
> templates and tables
>
> CSS for layout is certainly "there". Perhaps it's not
there for you, but
> it surely is for others.
>
> There is nothing worse than a morass of nested tables
spanned to death,
> not only for you as the maintainer of the site, but also
for the browsers,
> some of which simply cannot render such pages. CSS
layouts do not have
> these problems.
>
> Future maintainence, bandwidth usage, and simplicity of
layout are big
> benefits of using CSS as opposed to tables.
>
> But let's not make this a holy war. Nobody here is
saying that you have
> to replace tables with CSS. Everyone here (I think)
agrees that if tables
> work better for you, then use them. BUT use them
correctly if you are
> going to do that. It's pretty simple, really....
>
> --
> Murray --- ICQ 71997575
> Adobe Community Expert
> (If you *MUST* email me, don't LAUGH when you do so!)
> ==================
>
http://www.dreamweavermx-templates.com
- Template Triage!
>
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
>
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
>
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
> ==================
>
>
> "Arrdvark" <[email protected]> wrote in
message
> news:[email protected]...
>> tables are much simpler, translate well to knowledge
people have from
>> other tools (ie; ms word) and can do layout quite
well. CSS for layout is
>> simply not there yet - it feels like one great big
hack and is difficult
>> for people to learn, especially causal web designers
who just dont have
>> the time to amass all teh knowledge and expereince
needed just to get a
>> simple css layout working in both major browsers.
One of the things that
>> made the web so big was how simple it was to publish
to - CSS layout is a
>> step backward in this regard.
>>
>> tables are still fine for most sites, a perfectly
valid choice. Its only
>> the accesibility issue which tables lose points for.
Possibly, the only
>> benefit of css layout is that it can be centrally
goverened through a
>> linked style sheet, but even this can be done with
DW templates and
>> tables, or dynamic pages and tables (ie: asp.net
master pages).
>>
>> I am 50 / 50 these days as to wether css layout is
worth the hassle for
>> the average website being bult by the avergae
person.
>>
>>
>>
>>
>> "FreakyJesus" <[email protected]>
wrote in message
>> news:[email protected]...
>>> Very well said, Thierry
>>> And Arrdvark, I hear you on this:
>>> "it almost always causes total confusion as to
"why" this is the case
>>> and puts
>>> people right off CSS altogther."
>>> I am showing a friend how to use CSS (blind
leading the blind) and on a
>>> regular basis she's like "wouldn't this be
easier with tables within
>>> tables."
>>> Css CAN be very confusing.
>>>
>>> Andy
>>>
>>>
>>>
>>>
>>>
quote:
Originally posted by:
Newsgroup User
>>> Al wrote:
>>> > On Fri, 01 Dec 2006 09:39:18 -0500, Murray
*ACE*
>>> > <[email protected]>
wrote:
>>>
>>> >> Not only something different, but an
inferior choice at that!
>>>
>>> > I guess it can sometimes be difficult for
an inexperienced user to
>>> > assess and evaluate multiple solutions. If
there are downsides to
>>> > public forums, that would be at least one
of them. It's hard enough
>>> > for newbies to assess a single solution,
but wading through a
>>> > sub-discussion between third-parties
micro-analyzing their personal
>>> > favorite solutions can be untenable.
>>>
>>> I agree, but I can also understand that it can
be frustrating for people
>>> (people in general) who try to help to see that
the OP (OPs in general)
>>> didn't even try a solution that didn't require
too much effort.
>>> IMHO, there was not much for the OP to go
through here since *early* in
>>> this
>>> thread, the OP had everything to make it work.
>>> First post FreakyJesus said to set up the
left/right margin of the DIV
>>> to
>>> "auto" and second post Murray gives a very
explicit "fix" for IE5:
>>> body { text-align:center; }
>>> #graybox { text-align:left; }
>>> Actually, just trying margin auto could have
been enough for the OP.
>>> Sometimes it is important to know "some"
Javascript, HTML or else to be
>>> able
>>> to implement (not necessary understand) a
solution, but here it was not
>>> the
>>> case.
>>>
>>> Nothing against the OP here, and nothing to get
excited either ;-)
>>> This is just a general statement about the other
side of the coin.
>>>
>>> > Note to self: Recite Serenity Prayer before
posting here in the
>>> > future.
>>>
>>> Let's hope that works :)
>>>
>>> --
>>> Thierry
>>> Articles and Tutorials:
http://www.TJKDesign.com/go/?0
>>> The perfect FAQ page:
http://www.TJKDesign.com/go/?9
>>> CSS-P Templates:
http://www.TJKDesign.com/go/?1
>>> CSS Tab Menu:
http://www.TJKDesign.com/go/?3
>>>
>>>
>>>
>>>
>>>
>>>
>>
>>
>
>

Div tag problem

Hi there,
i am creating a website.i seem to be having a bit of trouble with div tag...i think.the navigation bar and the main content seem to be overlapping each other.any ideas?id appreciated any help.
thanks.
<body>
<div id="header">Heading</div>
<div id = "nav">
<ul id="Fyp">
<li><a href="html/Index.html">Home</a> </li>
<li><a href="html/Conventional.html">Conventional Encryption</a></li>
<li><a href="#">Public Key Encryption</a>
    <ul>
<li><a href="html/PublicKey-Confidentiality.html">PublicKey-Confidentiality</a></li>
<li><a href="html/PublicKey-Authentication.html">PublicKey-Authentication</a></li>
<li><a href="html/Public Key-Confidentiality and Authentication.html">Public Key-Confidentiality and Authentication</a></li>
    </ul>
</li>
<li><a href="#">MAC Encryption</a>
    <ul>
<li><a href="#">MAC - Message Authentication</a></li>
     <li><a href="#">Message Authentication and Confidentiality (Plaintext)</a></li>
     <li><a href="#">Message Authentication and Confidentiality(Ciphertext)</a></li>
</ul>
</li>
   <li><a href="#">HASH Encryption</a>
       <ul>
            <li><a href="#">Encryption after Concatenation</a></li>
            <li><a href="#">Encryption before Concatenation</a></li>
              <li><a href="#">Authentication</a></li>
            <li><a href="#">Authentication and Confidentiality</a></li>
           <li><a href="#">Secret Value</a></li>
          <li><a href="#">Secret Value and Encryption</a></li>
     </ul>
    </li>
   <li><a href="#">Self Test</a></li>
</ul>
</div>
<div id="main_content">
<p> </p>
<p>This is the home page for Message Authentication and Digital Signatures.This page will explain the funamental basis of these elements.</p>
<p> </p>
<p><strong>Authentication</strong>:</p>
<p><a name="#Authtentication"></a>
The Authentication service is concerned with assuring that a communication is authentic. Authentication acts as an warning or a alarm signal. The function of the authentication service is to assure the recipient that he message is from the source that it calms to be from.</p>
<p> </p>
<p><strong>Confidentiality</strong>:</p>
<p><a name = "Confidenitiality"></a>
Confidentiality is the protection of transmitted data from passive attacks. This makes sure that the message sent can not be read by anyboby except for the intended recipient .
</p>
<p> </p>
<p><strong>Public Key:</strong></p>
<p><a name = "Public Key"></a>
</p>
<p><strong>Digital Signature:</strong>
<p><a name = "Digital Signature"></a></p>
</p>
<p><strong>Integrity:</strong>
<p><a name = "Integrity"></a> </p>
<p><strong>MAC Function:</strong></p>
<p><a name = "MAC"></a> </p>
<p>A MAC (Message Authentication Code) is a small fixed size block of data that is appended to the message. The technique assumes hat two communicating parties say (Source A and B) share a common secret key(k). When A sends a message to B, it calculates the MAC as a function of the message and the key. The recipient performs the same calculation on the received message using the same key, to generate a new MAC. The received MAC and the calculated MAC are then compared. If the received MAC matches the calculated MAC, then the message is said to be authentic.</p>
</p>
</div>
<div id="footer">
<p>
Footer - all about the designer and contact links go here
</p>
</div>
</body>
</html>

Here ya go.
body {
margin:0px;
padding:0px;
text-align:center;
font-size:1.0em;
font-family:trebuchet ms, tahoma, arial, sans-serif;
#container {
text-align:left;
margin:0px;
width:1270px;
border:1px black solid;
padding: 0px;
#header {
text-align:center;
width:1270px;
#width:1022px;
height:100px;
font-size:2.0em;
background-color:white;
color:white;
padding-top:0px;
padding-right:0px;
border-bottom:1px black solid;
#nav {
width:1270px;
#width:1270px;
height:24px;
font-size:0.8em;
background-color:#20548E;
color:black;
border-bottom:1px black solid;
#main_content {
width:1270px;
#width:1022px;
font-size:0.9em;
background-color:white;
color:black;
border-bottom:1px black solid;
#footer {
text-align:center;
width:1270px;
#width:1022px;
height:100px;
font-size:1.0em;
background-color:#20548E;
color:white;
border-bottom:1px black solid;
#Fyp
{ margin: 0;
     padding: 0;
#Fyp li
{ float: left;
list-style: none;
font: 12px Tahoma, Arial;
#Fyp li a
{ display: block;
background: #20548E;
padding: 5px 12px;
text-decoration: none;
border-right: 1px solid white;
width: 140px;
color: #EAFFED;
white-space: nowrap;
#Fyp li a:hover
{ background: #1A4473;
#Fyp li ul
{ margin: 0;
   padding: 0;
   position: absolute;
   visibility: hidden;
   border-top: 1px solid white;
#Fyp li ul li
{ float: none;
   display: inline;
#Fyp li ul li a
{ width: auto;
   background: #9F1B1B;
#Fyp li ul li a:hover
{ background: #7F1616;

IE7 seems to "hide" text in DIV tags

Similar Messages

Maybe you are looking for