SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Enthusiast
    Join Date
    Mar 2009
    Location
    Chicago
    Posts
    49
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Header Image "Touch" Div Content

    How in the world do I get the header image to "touch" the div content. I don't want that space between the two.
    HELP! This is driving me crazy.
    Thank you everyone for all your help.
    Karen

    <!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>American Rhetoric: Movie Speech</title>

    <style type="text/css">

    body {
    background-color:#A82735;
    }

    #Header {
    width:700px;
    padding: -10em;

    margin: 0px auto;
    background-color: #ffffff;
    }

    #Content {
    width:650px;
    height: auto;
    margin: 0px auto;
    text-align: left;
    padding-right: 25px;
    padding-left: 25px;
    padding-bottom: 20px;
    background-color: #fff;

    }
    h1, h2, h3
    {

    background-color: #a82735;
    color: #FFF;
    font-family: Verdana, Arial, Helvetica, sans-serif
    padding-botom: 0.2em;
    padding-right: 0.2em;
    padding-left: 0.2em;
    text-align:center;
    }

    span.emcee_firstword {
    font: bold 1em "Times New Roman", Times, serif;
    font-size: 1.5em;
    color: #fff;
    background:#a82735
    }

    span.douglas_firstword {
    font: bold 1em "Times New Roman", Times, serif;
    font-size: 1.5em;
    color:006;
    font-weight:bold;
    }

    span.lincoln_firstword {
    font: bold 1em "Times New Roman", Times, serif;
    font-size: 1.5em;
    color: #a82735;
    font-weight:bold;
    }

    span.emcee {
    font: 1.2em "Times New Roman", Times, serif;
    }

    </style>

    </head>

    <body>

    <center><p><img src="/Images/header_image.jpg" alt="American Flag" width="700" height="100" /></p></center>

    <div id="Content">

    <h1>American Rhetoric: Movie Speech</h1>

    <h2>&quot;Abe Lincoln in Illinois&quot; (1940)</h2>

    <h3>Lincoln-Douglas Debate</h3>

    <p><span class="emcee_firstword">Emcee/span> We have now heard the leading arguments of the two candidates for the high office of United States Senator from Illinois: Judge Stephen A. Douglas and Mr. Abraham Lincoln. According to the usual custom of debate each of the candidates will now speak in rebuttal. Judge Douglas.</p>

    <p><span class="douglas_firstword">Douglas/span> My fellow citizens: My good friend Mr. Lincoln has addressed you with his usual artless sincerity, his pure homely charm, his perennial native humor. He has devoted a generously large portion of his address to most amiable remarks upon my fine qualities as a man, if not as a statesman, for which I express deepest gratitude. But at the same time, I most earnestly beg you not to be deceived by his seeming innocence, his carefully cultivated spirit of goodwill. For in each of his little homilies lurk concealed weapons. Like Brutus in Shakespeare’s immortal tragedy, Mr. Lincoln is an honorable man. But also like Brutus, he is an adept at the art of inserting daggers between an opponent’s ribs just when said opponent least expects it. Behold me, ladies and gentleman, I am covered with scars.</p>

    <p>Mr. Lincoln makes you laugh with his pungent anecdotes. He draws tears from your eyes with his dramatic pictures of the plight of the black slave laborer in the South. Always he guides you skillfully to the threshold of truth. But then, as you are about to cross it, he diverts your attention elsewhere. He never, by any mischance, makes reference to the condition of labor here in the North. Perhaps he’s ignorant of the fact that tens of thousands of workers are now on strike: hungry men marching through the streets in ragged order promoting riots, because they’re not paid enough to keep the flesh upon the bones of their babies. What kind of liberty is this? And what kind of equality?</p>

    <p>Mr. Lincoln harps constantly on this subject of equality. He repeats over and over the argument used by Lovejoy and other abolitionists to it -- that the Declaration of Independence having declared all men free and equal by divine law. Thus, Negro equality is an inalienable right. Contrary to this stands the verdict of the Supreme Court in the case of Dred Scott.¹ Mr. Lincoln is a lawyer and I presume therefore that he knows that when he seeks to destroy public confidence in the integrity, the inviolability of the Supreme Court he is preaching revolution. He asks me to state my opinion of the Dred Scott decision, and I answer him unequivocally by saying I take the decisions of the Supreme Court to be the law of the land, and I intend to obey them as such; nor will I be swayed from that position by all the ranting of all the fanatics who preach racial equality -- who would ask us to vote, eat, sleep, and marry with negroes.</p>

    <p>And I say further, let each State mind its own business and leave its neighbors alone. If we’ll stand on that principle then Mr. Lincoln will find that this great Republic can exist forever divided into free and slave States and we can go on, as we have done, increasing in wealth, in population, in power, until we shall become the admiration and the terror of the world.</p>

    <p><span class="emcee_firstword">Emcee/span> Mr. Abraham Lincoln.</p>

    <p><span class="lincoln_firstword">Lincoln/span> Judge Douglas has paid tribute to my skill with the dagger. I thank him for that, but I must admit that he can do more with that weapon than I can. He can keep ten daggers flashing in the air at the same time. Fortunately, he’s so good at it that none of the knives ever falls and hurts anyone.</p>

    <p>Now, you’ve heard the Judge make illusion to those who advocate voting, and eating, and marrying, and sleeping with negroes. Whether he meant me specifically I do not know. If he did, I can only say that just because I do not want a colored woman for a slave I do not necessarily want her for a wife. I do not need to have her for either. I can just leave her alone. In some respects, she is certainly not my equal, any more than I am the Judge’s equal in some respects. But in her natural right to eat the bread she earns with her own hands without asking leave of somebody else, she is my equal and the equal of all others.</p>

    <p>Now you heard the Judge speak about our own labor conditions. As an American I cannot be proud that such conditions exist. But as an American I can ask, &quot;Would any of the striking workers in the North elect to change places with the slaves in the South?&quot; Will they not rather say the remedy is in our hands. And still as an American I can say, &quot;Thank God we live under a system by which men have the right to strike.&quot; I am not preaching rebellion. I don’t have to. This country, with its institutions, belongs to the people who inhabit it.</p>

    <p>Whenever they shall grow weary of the existing government, they can exercise their constitutional right of amending it or their revolutionary right to dismember or overthrow it. If the founding fathers gave us anything they gave us that. The purpose of the Dred Scott decision is to make property and nothing but property of the Negro in all States of the Union. It is the old issue of human rights versus property rights. It is the eternal struggle between two principles: the one, the common right of humanity; the other the divine right of kings. It is the same spirit which says, &quot;You toil and work and earn bread and I’ll eat it.&quot;</p>

    <p>As a nation, we began by declaring &quot;all men are created equal.&quot; There was no mention of any exception to that rule in the Declaration of Independence. But we now practically read it &quot;all men are created equal except Negroes.&quot; If we are to accept this doctrine of race or class discrimination, what is to stop us in future from decreeing &quot;all men are created equal except for Negroes, foreigners, Catholics, Jews,&quot; or just &quot;poor people&quot;? That is the conclusion towards which the advocates of slavery are driving us. &quot;Let each State mind its own business,&quot; says Judge Douglas. &quot;Why stir up trouble?&quot; This is the complacent policy of indifference to evil, and that policy I cannot but hate.</p>

    <p>I hate it because of the monstrous injustice of slavery itself. I hate it because it deprives our Republic of its just influence in the world, enables the enemies of free institutions everywhere to taunt us as hypocrites, causes the real friends of freedom to doubt our sincerity, and especially because it forces so many good men among ourselves into an open war with the very fundamentals of civil liberty: denying the good faith of the Declaration of Independence and insisting that there is no right principle of action but self interest.</p>

    <p>In his final words tonight, the Judge said that we can be &quot;the terror of the world.&quot; I don’t think we want to be that. I think we would prefer to be the encouragement of the world: the proof that at last man is worthy to be free. But we shall provide no such encouragement unless we can establish our ability as a nation to live and grow, and we shall surely do neither if these States fail to remain united. There can be no distinction in the definition of liberty as between one section and another, one class and another, one race and another. A house divided itself cannot stand. This government cannot endure permanently half slave and half free.</p>

    </div>

    </body>

    </html>

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,319
    Mentioned
    462 Post(s)
    Tagged
    8 Thread(s)
    Karen, browsers put default margins and paddings on various elements, which you have to remove if you don't want them.

    In this case, the <p> that contains the image has default top and bottom margins.

    So you need a CSS rule saying

    Code:
    p {
      margin: 0;
    }
    However, that rule alone will remove the margins on all paragraphs; so, to be safe, firstly add a class to the header paragraphs:

    Code:
    <p class="header"><img src="/Images/header_image.jpg" alt="American Flag" width="700" height="100" /></p>
    then change the CSS to

    Code:
    p.header {
      margin: 0;
    }
    Another option, if you don't want to add a class, is simply to put this in your CSS

    Code:
    center p {
      margin: 0;
    }
    But if you use <center> elsewhere on the page and put a paragraph inside it, it will apply to that too.

    Strictly speaking, the <center> element is out of date. There are better ways to center your header; but this is another issue.

  3. #3
    SitePoint Enthusiast
    Join Date
    Mar 2009
    Location
    Chicago
    Posts
    49
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you soooooo much for your help - It worked great!

    Is this the proper way to center the image?

    <center><p class="header"><img src="/images/header_image.jpg" alt="American Flag" width="700" height="100" /></p></center>

    Karen

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,319
    Mentioned
    462 Post(s)
    Tagged
    8 Thread(s)
    You're most welcome! Glad it helped.

    Quote Originally Posted by Karen615 View Post
    Is this the proper way to center the image?

    <center><p class="header"><img src="/images/header_image.jpg" alt="American Flag" width="700" height="100" /></p></center>
    This would be a better method:

    First, remove the <center> element, leaving this:

    Code:
    <p class="header"><img src="/images/header_image.jpg" alt="American Flag" width="700" height="100" /></p>
    Then alter the styles to this:

    Code:
    p.header {
      margin:0 auto;
      width: 700px;
      text-align: center;
    }
    The margin: 0 auto bit means 0px on top and bottom, and auto margins left and right, which centers any element horizontally (as long as the element has a width set). The text-align: center is not really needed here: but it would keep the image centered if it weren't as wide as the paragraph itself.

    Hope that makes sense.

  5. #5
    SitePoint Enthusiast
    Join Date
    Mar 2009
    Location
    Chicago
    Posts
    49
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I cannot thank you enough. It worked like a charm.
    Thank you, Karen

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,319
    Mentioned
    462 Post(s)
    Tagged
    8 Thread(s)
    Great! I look forward to seeing you around these parts again.

  7. #7
    SitePoint Enthusiast
    Join Date
    Mar 2009
    Location
    Chicago
    Posts
    49
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks! Ditto!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •