Quantcast
Channel: Adobe Community: Message List - Graphic spacing issue
Viewing all articles
Browse latest Browse all 14

Re: Graphic spacing issue

$
0
0

Ok. Let me know if this works. And thanks for taking a look.

CSS

body

{

    font-family: Arial, Helvetica, sans-serif;

    margin: 0;

    padding: 0;

    text-align: center;

    color: #333333;

    overflow: scroll;

}

 

#container

{

    width: 940px;

    margin: 0 auto;

    text-align: left;

}

 

#flashContent { width:100%; height:100%; }

 

#header

{

    background: url(header.gif) no-repeat;

    height: 134px;

}

 

/*####################################### MENU #######################################*/

 

#menu

{

    text-align: center;

    line-height: 2em;

    padding-bottom: 0;

    height: 35px;

    background: url(menu.gif) repeat-x;

    color: #fff;

    /*background-color: #32447f;*/

}

 

#menu a

{

    text-decoration: none;

    color: #fff;

    text-align: left;

    text-transform: uppercase;

    font-size: 85%;

    padding-left: 30px;

    padding-right: 30px;

    padding-top: 12px;

    padding-bottom: 12px;

}

 

#menu a:hover

{

   color: #c6a45a;

}

 

/*####################################### MENU END #######################################*/

 

#flash {

    height: 361px;

    background-color: #000;

}

 

/*####################################### HOMEPAGE THREE COLUMNS #######################################*/

 

#threemain h1, ul, li {

margin: 0;

padding: 0;

}

#threemain h1 {

    font-size: 95%;

    color: #344764;

    font-weight: bold;   

}

#threemain h2 {

    font-size: 75%;

    font-weight: bold;

    text-transform: uppercase;

    padding: 0;

    margin: 0;

}

#threemain ul {

    margin-left: 0;

    padding-left: 0;

    font-size: small;

    padding-top: 0;

    margin-top: 0;

   

}

#threemain li {

    list-style-type: none;

}

#threemain p {

    font-size: small;

    padding: 0;

    margin: 0;

   

}

#threemain a {

    text-decoration: none;

    color: #039;

}

#threemain a.h1 {

    color: #344764;   

}

#threemain a.prodtitle {

    font-size: 90%;

    color: #69C;   

}

#threemain a.request {

    color: #333;

}

 

#threemain a.prodtitle:hover, #threemain a.view:hover {

    color: #c6a45a;   

}

 

/*####################################### HOMEPAGE THREE COLUMNS END #######################################*/

 

/*####################################### SIDEBAR #######################################*/

 

#sidebar

{

    float: left;

    width: 300px;

    height: 500px;

    border-right: thin #eaebeb solid;

}

#sidebar .title

{

    font-weight: bold;

    font-size: 100%;

    display: block;

    padding-bottom: 8px;

    color: #444;

    text-decoration: underline;

    letter-spacing: 0.2em;

    margin-bottom: 0.5em;

    margin-top: 3em;

}

 

#sidebar a

{

    display: block;

    padding: 6px;

    color: #76787a;

    text-decoration: none;

    border-bottom: thin #eaebeb solid;

    margin-bottom: 1em;

}

 

#sidebar a:hover

{

    color: #c6a45a;

    font-family: Arial, Helvetica, sans-serif;

}

 

#sidebar .current {

    color: #c6a45a;

 

}

 

#sidebar ul

{

    text-align: left;

    margin: 0;

    padding: 0 0 0 50px;

    line-height: 1em;

}

 

#sidebar li

{

    text-align: left;

    font-weight: bold;

    overflow: hidden;

    font-size: 90%;

    line-height: 1em;

    list-style-type: none;

}

 

/*####################################### SIDEBAR END #######################################*/

 

/*####################################### SIDEBAR ALTERNATE #######################################*/

 

#sidebaralt

{

    float: left;

    width: 250px;

    height: 500px;

    border-right: thin #eaebeb solid;

}

#sidebaralt .title

{

    font-weight: bold;

    font-size: 100%;

    display: block;

    padding-bottom: 8px;

    color: #444;

    text-decoration: underline;

    letter-spacing: 0.2em;

    margin-bottom: 0.5em;

    margin-top: 3em;

}

 

#sidebaralt a

{

    display: block;

    padding: 6px;

    color: #76787a;

    text-decoration: none;

    border-bottom: thin #eaebeb solid;

    margin-bottom: 1em;

}

 

#sidebaralt a:hover

{

    color: #c6a45a;

}

 

#sidebaralt .current {

    color: #c6a45a;

 

}

 

#sidebaralt ul

{

    text-align: left;

    margin: 0;

    padding: 0 0 0 50px;

    line-height: 1em;

}

 

#sidebaralt li

{

    text-align: left;

    font-weight: bold;

    overflow: hidden;

    font-size: 90%;

    line-height: 1em;

    list-style-type: none;

}

 

/*####################################### SIDEBAR ALTERNATE END #######################################*/

 

/*####################################### CONTENT #######################################*/

 

#content

{

    margin: 0 0 0 300px;

}

 

#text {

padding-left: 50px;   

}

 

#content h1

{

    text-align: left;

    color: #c6a45a;

    line-height: 1.2em;

    font-weight: 400;

    margin: 25px 0px 20px 0px;

    font-size: 175%;

}

 

#content h2

{

    text-align: left;

    font-weight: 200;

    line-height: 1.2em;

    margin: 20px 0px 15px 0px;

    font-size: 135%;

}

 

#content p

{

    font-size: small;

    text-align: left;

    padding: 0;

    margin: 0px 0px 20px 0px;

    line-height: 1.5em;

}

 

#content a

{

    text-align: left;

    color: #039;

    line-height: 1.5em;

    overflow: hidden;

}

 

#content a:hover

{

    color: #c6a45a;

}

 

#content ul, ol

{

    font-size: small;

    font-weight: bold;

    line-height: 2em;

    margin-left: 3.5em;

}

 

#content li

{

    font-size: small;

    padding: 0.2em;

    font-weight: normal;

    line-height: 1.4em;

}

 

#content sup

{

    color: #003300;

    font-weight: bold;

    font-size: small;

}

 

.partners ul{

   

   

}

 

.partners li{

   

   

}

 

.column1 {

    float: left;

width: 250px;

border-top: solid 1px #aaa;

border-right: solid 1px #aaa;

margin-top: 10px;

padding-right: 30px;

margin-top: 10px;

padding-top: 10px;

}

 

.column2 {

    float: left;

width: 250px;

border-top: solid 1px #aaa;

margin-top: 10px;

padding-left: 30px;

margin-top: 10px;

padding-top: 10px;

}

 

/*####################################### CONTENT END #######################################*/

 

/*####################################### CONTENT ALTERNATE #######################################*/

 

#contentalt

{

    margin: 0 0 0 250px;

}

 

#textalt {

padding-left: 50px;   

}

 

#contentalt h1

{

    text-align: left;

    color: #c6a45a;

    line-height: 1.2em;

    font-weight: 400;

    margin: 25px 0px 20px 0px;

    font-size: 175%;

}

 

#contentalt h2

{

    text-align: left;

    font-weight: 200;

    line-height: 1.2em;

    margin: 20px 0px 15px 0px;

    font-size: 135%;

}

 

#contentalt p

{

    font-size: small;

    text-align: left;

    padding: 0;

    margin: 0px 0px 20px 0px;

    line-height: 1.5em;

}

 

#contentalt a

{

    text-align: left;

    color: #039;

    line-height: 1.5em;

    overflow: hidden;

}

 

#contentalt a:hover

{

    color: #c6a45a;

}

 

#contentalt ul, ol

{

    font-size: small;

    font-weight: bold;

    line-height: 2em;

}

 

#contentalt li

{

    font-size: small;

    padding: 0.2em;

    font-weight: normal;

    line-height: 1.4em;

}

 

#contentalt sup

{

    color: #003300;

    font-weight: bold;

    font-size: small;

}

 

/*####################################### CONTENT ALTERNATE END #######################################*/

 

/*####################################### FOOTER #######################################*/

 

#footer {

    text-align: center;

    color: #666666;

    font-size: 60%;

        height: 30px;

        padding-top: 1em;

 

}

#footer span {

padding-left: 0.2em;

padding-right: 0.2em;

}

 

#footer a

{

    text-align: left;

    color: #039;

    line-height: 1.5em;

    overflow: hidden;

}

 

#footer a:hover

{

    color: #c6a45a;

}

 

/*####################################### FOOTER END #######################################*/

 

img.icon

{

    padding: 0;

}

 

#pic {

    float: right;

    padding-left: 1em;

    padding-bottom: 1em;

    width: 300px;

}

 

.clearfloat

{

    clear: both;

    height: 0;

    font-size: 1px;

    line-height: 0px;

}

 

/*####################################### MISC #######################################*/

 

#partners td {

    border-bottom: thin solid #06C;

    padding-top: 1em;

}

 

#partners img {

    border: none;

}

 

#instruct td {

    padding: 0.5em;

    border: solid thin;

}

#instruct table {

    border: solid thin;

}

 

#contact {

    font-size: small;

    text-align: left;

    padding: 0;

    margin: 0px 0px 20px 0px;

    line-height: 1.5em;   

}

 

.b1 {

    padding: 0.5em;

}

#container #sidebar ul li {

    color: #c6a45a;

}

#container #sidebar ul li {

    color: #c6a45a;

}

#container #sidebar ul li .current a {

    color: #c6a45a;

}

 

HTML

<!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="cache-control" content="no cache">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Name of Company</title>

<link href="styles.css" rel="stylesheet" type="text/css" />

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />

<style type="text/css">

<!--

p.MsoNormal {

margin:0in;

margin-bottom:.0001pt;

font-size:11.0pt;

font-family:"Calibri","sans-serif";

}

-->

</style>

</head>

<body>

<div id="container">

  <div id="header"> </div>

  <div id="menu"> <a href="index.html">Home</a> <a href="name.html">Title</a> <a href="name.html">Title</a> <a href="name.html">Title</a> <a href="name.html">Title</a> <a href="name.html">Title</a></div>

  <div id="sidebar">

    <ul>

      <li class="title"> Library

        <div align="left"> </div>

      </li>

      <li>

        <h4 class="current">June 2013</h4>

      </li>

      <li>       

        <h5><a href="name.html">title</a> </h5>

      </li>

      <li>       

        <h5><a href="name.html">title</a> </h5>

      </li>

      <li>

    <h4 class="current">May 2013</h4>

    </li>

    <li>       

        <h5><a href="name.html">title</a> </h5>

      </li>

      <li>       

        <h5><a href="name.html">title</a> </h5>

      </li>

    <li>       

        <h5><a href="anothername.html">anothertitle</a> </h5>

      </li>

    <li>       

        <h5><a href="name.html">title</a> </h5>

      </li>

      <li>

        <h4 class="current">April 2013</h4>

      </li>

      <li>       

        <h5><a href="name.html">title</a> </h5>

      </li>

      <li>       

        <h5><a href="name.html">title</a> </h5>

      </li>

      <li>       

        <h5><a href="name.html">title</a> </h5>

      </li>

      <li>       

        <h5><a href="name.html">title</a> </h5>

      </li>

      <li>

        <h4 class="current"><a href="name.html">March 2013</a></h4>

      </li>

      <li>

        <h4 class="current"><a href="name.html">February 2013</a></h4>

      </li>

      <li>

        <h4 class="current"><a href="name.html">January 2013</a></h4>

      </li>

    </ul>

  </div>

  <div id="content"><img src="graphic.jpg" width="638" height="150" />

    <div id="text">

  <h1> Tip of the Week</h1>

          <td align="left" valign="middle"><p>4/26/2013</p>

            <h4>Did you know?</h4>

            <p>words words words <strong>a word</strong> words words words.

            <p>a whole sentence of words words words words words words words words words.<br />

              <br />

GRAPHIC I'M HAVING ISSUES WITH             <img src="images/TipoftheWeek/luckycharmgraphic.jpg" width="882" height="300" /><br />

              <br />

              <strong>a few more words (some more words)</strong>:  


Viewing all articles
Browse latest Browse all 14

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>