Viewing 6 replies - 1 through 6 (of 6 total)
  • what does the css for ‘left’ and ‘right’ look like?

    Also, you don’t close the right div before opening the left div, is that intentional?

    Thread Starter stlastla

    (@stlastla)

    Where do I find the css? in the page.php or style.css?

    About the close right div that was not intentional.

    OK, well…. you are using div align it seems? that is deprecated…
    https://www.w3schools.com/tags/att_div_align.asp

    so if you are trying to align divs, you have to use css to do so.

    but you shouldn’t need to use the align on images…if you just put the image code in what happens? Like with no div align code?

    all css code is in style.css most likely. We can tweak layout using css, but first it’d be good to just get the images in place to see what we get

    Thread Starter stlastla

    (@stlastla)

    Ok, I have now removed the Align and the buttons have changed place, but still no picture showing for the LinkedIn button.

    Here you have the css:

    /*=== Setup ===*/
    * {
    border: 0;
    margin: 0;
    padding: 0;
    outline: none;
    }
    body {
    background: url(images/bgr.gif) #f7f6f6 repeat-x top;
    color: #404040;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: .75em;
    }
    a {
    color: #33707e;
    text-decoration: underline;
    }
    a:hover {
    text-decoration: none;
    }
    input, select, textarea {
    border: #cfcfcf 1px solid;
    color: #404040;
    font-size: 12px;
    padding: 3px;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    }
    li {
    list-style: none;
    }
    h2 {
    color: #222222;
    font-size: 1.5em;
    font-weight: normal;
    letter-spacing: -1px;
    margin: 0 0 1em;
    }
    h3 {
    color: #333333;
    font-size: 1.2em;
    margin: 0 0 .8em;
    }
    h4 {
    font-size: 1em;
    margin: 0 0 1em;
    }
    p {
    line-height: 1.5em;
    padding: 0 0 1.3em;
    }
    /*=== Layout ===*/
    #page {
    margin: 0 auto;
    width: 975px;
    }
    #page-bot {
    background: url(images/page-bot.gif) repeat-x top;
    height: 39px;
    }
    /*=== H eader ===*/
    #header{
    height: 101px;
    margin: 0 0 1px;
    }
    /*- Logo -*/
    #header h1 {
    background: url(images/logo.gif) no-repeat;
    float: left;
    text-indent: -9999px;
    width: 408px;
    }
    #header h1 a {
    display: block;
    height: 101px;
    }
    #header h1 a:hover {
    text-decoration: none;
    }
    /*=== Navigation ===*/
    /*- Top Nav -*/
    .topnav {
    font-size: 10px;
    font-weight: bold;
    height: 31px;
    overflow: hidden;
    }
    .topnav li {
    background: url(images/topnav-sep.gif) no-repeat left;
    float: left;
    line-height: 30px;
    }
    .topnav li:first-child {
    background: none;
    }
    .topnav li:first-child a {
    padding: 0 7px 0 4px;
    }
    .topnav li a {
    color: #333333;
    display: block;
    float: left;
    padding: 0 7px 0 8px;
    text-decoration: none;
    }
    .topnav li a:hover,
    .topnav li.active a {
    text-decoration: underline;
    }
    /*- Nav1 -*/
    #nav1 {
    background: url(images/nav1-sep.gif) no-repeat left top;
    font-size: 13px;
    height: 37px;
    }
    #nav1 ul.sf-menu li {
    position: relative;
    background: url(images/nav1-sep.gif) no-repeat right top;
    float: left;
    line-height: 37px;
    padding: 0 1px 0 0;
    text-align: center;
    }
    #nav1 ul.sf-menu li a {
    color: #333333;
    display: block;
    position: relative;
    float: left;
    text-decoration: none;
    padding: 0 29px;
    cursor: pointer;
    }
    #nav1 ul.sf-menu li a:hover {
    text-decoration: none;
    background: #FEFEFE;
    }
    #nav1 ul.sf-menu li ul.sub-menu {
    border: 1px solid #000000;
    background: #272726 url(images/ul_children_bg.gif) repeat-y top right;
    }
    #nav1 ul.sf-menu li ul.sub-menu li {
    background: url(images/ul_children_li_bg.gif) no-repeat bottom right;
    }
    #nav1 ul.sf-menu li ul.sub-menu li a {
    color: #bebebe;
    text-decoration: none;
    display:block;
    }
    #nav1 ul.sf-menu li ul.sub-menu li a:hover {
    text-decoration: none;
    background: none;
    }
    #nav1 ul.sf-menu li ul.sub-menu li ul.sub-menu {
    border: 1px solid #000000;
    border-left: none;
    background: #272726 url(images/ul_children_ul_children_bg.gif) repeat-y top left;
    }
    #nav1 ul.sf-menu li ul.sub-menu li ul.sub-menu li {
    background: url(images/ul_children_li_bg.gif) no-repeat bottom right;
    }
    #nav1 ul.sf-menu li ul.sub-menu li ul.sub-menu a {
    color: #bebebe;
    text-decoration: none;
    }
    #nav1 ul.sf-menu li ul.sub-menu
    {
    margin:5px 0 0 0;
    }
    #nav1 ul.sf-menu li ul.sub-menu ul.sub-menu
    {
    margin:-1px 0 0 27px;
    }
    /*=== All Columns ===*/
    #columns {
    margin: 37px 0 0;
    padding: 0 0 15px;
    display: table-cell;
    display: block;
    height: auto !important;
    height: 900px;
    min-height: 900px;
    }
    /*=== Center Column ===*/
    #centercol {
    float: left;
    width: 660px;
    }
    /*=== Right Column ===*/
    #rightcol {
    float: right;
    width: 305px;
    }
    #rightcol a {
    color: #404040;
    text-decoration: none;
    }
    /*=== Sub Columns ===*/
    .subcols {
    background: url(images/subcols-bgr.gif) repeat-y left;
    height: 1%;
    }
    .col1, .col2 {
    float: left;
    width: 285px;
    }
    .col2 {
    float: right;
    }
    .col1 > div:last-child,
    .col2 > div:last-child {
    border-top: none;
    }
    /*=== Post ===*/
    /*- Post Title -*/
    .post-title h1 {
    color: #333333;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: -0.5px;
    }
    .post-title h1 span {
    color: #33707e;
    }
    .post-title h1.author {
    color: #888888;
    font-size: 14px;
    padding-top: 2px;
    }
    .post-title h2, .post-title h2 a {
    font-size: 30px;
    font-weight: bold;
    letter-spacing: -2px;
    margin: 0 0 .45em;
    color: #222222;
    text-decoration: none;
    }
    /*- Post Date -*/
    .post-date {
    margin: 0 0 1.25em;
    }
    .post-date a {
    color: #ffffff;
    }
    .post-date em {
    background: #5eb7cb;
    color: #ffffff;
    font-size: .9em;
    font-style: normal;
    padding: 3px 5px;
    line-height: 1.75em;
    }
    /*- Post Excerpt -*/
    .post-excerpt {
    display: table;
    font-size: 13px;
    font-style: italic;
    height: 1%;
    /* margin: 0 0 1em; */
    }

    /*- Post Content -*/
    .post-content ul {
    margin: 0 0 18px 25px;
    }
    .post-content ol {
    margin: 0 0 18px 25px;
    }
    .post-content ul,
    .post-content ul li {
    list-style-type:disc;
    list-style-position: inside;
    }
    .post-content ol,
    .post-content ol li {
    list-style-type: decimal;
    list-style-position: inside;
    }
    .post-content ol ol {
    list-style:upper-alpha;
    }
    .post-content ol ol ol {
    list-style:lower-roman;
    }
    .post-content ol ol ol ol {
    list-style:lower-alpha;
    }
    .post-content ul ul,
    .post-content ol ol,
    .post-content ul ol,
    .post-content ol ul {
    margin-bottom:0;
    }
    .post-content dl {
    margin:0 1.5em;
    }
    .post-content dt {
    font-weight:bold;
    }
    .post-content dd {
    margin-bottom:18px;
    }
    .post-content strong {
    font-weight: bold;
    }
    .post-content cite,
    .post-content em,
    .post-content i {
    font-style: italic;
    }
    .post-content blockquote {
    padding: 0 2em;
    padding-top: 1.3em;
    background: #f3f3f3;
    border-left: 3px solid #dddddd;
    }
    .post-content blockquote em,
    .post-content blockquote i,
    .post-content blockquote cite {
    font-style:normal;
    }
    .post-content pre {
    font:11px Monaco, monospace;
    line-height:18px;
    margin-bottom:18px;
    }
    .post-content code {
    font:11px Monaco, monospace;
    }
    .post-content abbr,
    .post-content acronym {
    border-bottom:1px dotted #333;
    cursor: help;
    }
    .post-content ins {
    text-decoration:none;
    }
    .post-content sup,
    .post-content sub {
    height: 0;
    line-height: 1;
    vertical-align: baseline;
    position: relative;

    }
    .post-content sup {
    bottom: 1ex;
    }
    .post-content sub {
    top: .5ex;
    }

    .post-content blockquote.left {
    float: left;
    margin-right:20px;
    text-align: right;
    width: 33%;
    border: none;
    border-left: 3px solid #dddddd;
    }
    .post-content blockquote.right {
    float: right;
    margin-left:20px;
    text-align: left;
    width: 33%;
    border: none;
    border-right: 3px solid #dddddd;
    }
    .post-content p,
    .post-content ul,
    .post-content ol,
    .post-content dd,
    .post-content pre,
    .post-content blockquote {
    margin-bottom: 1.3em;
    padding-bottom: 1.3em;
    line-height: 1.5em;
    }
    .post-content blockquote {
    padding-bottom: 0;
    margin-bottom: 2.6em;
    }
    .post-content pre,
    .post-content code {
    font:12px Monaco, monospace;
    line-height:20px;
    }
    /*- Post Author -*/
    .post-author {
    margin: 0 0 1em;
    }
    .author-details {
    font-size: .85em;
    }
    .author-descr {
    display: table;
    height: 1%;
    }
    /*- Social Links -*/
    .social-links {
    background: url(images/box-bgr2.gif) #f1f1f1 repeat-x top;
    height: 42px;
    padding: 0 18px;
    }
    .social-links .fl {
    line-height: 42px;
    }
    .social-links .fl span {
    background: url(images/comment_count_bg.gif) no-repeat center left;
    font-weight: bold;
    font-size: 14px;
    text-align: center;
    padding: 4px 0 8px 0;
    width: 33px;
    margin-right: 6px;
    display: inline-block;
    line-height: 32px;
    }
    .social-links .fr {
    padding: 9px 0 0;
    }
    .social-links .fr span {
    line-height: 21px;
    }
    .social-links img {
    margin: 0 0 0 2px;
    }
    /*- Related Posts -*/
    .post-rel {
    line-height: 1.5em;
    }
    .post-rel a {
    color: #33707E;
    }
    /*- Post Comments -*/
    .post-comments .fl {
    width: 80px;
    }
    .post-comments .fr {
    width: 520px;
    }
    /*- Widget Title – */
    .wtitle {
    background: url(images/box-bgr.gif) repeat-x top;
    }
    .wtitle h2 {
    line-height: 40px;
    margin: 0;
    padding: 0 0 0 18px;
    }
    /*=== Styling Boxes ===*/
    /*- Box1 -*/
    .box {
    background: #ffffff;
    border: 1px solid #cfcfcf;
    margin: 0 0 28px;
    padding: 1px;
    }
    .box .content {
    background: url(images/box-bgr.gif) #ffffff repeat-x top;
    height: 1%;
    padding: 18px;
    }
    .box.ads .content {
    padding-left: 15px;
    padding-right: 0;
    text-align: center;
    }
    #rightcol .box {
    margin: 0 0 10px;
    }
    /*- Box2 -*/
    .box2 {
    background: #f9f9f9;
    border: 1px solid #cfcfcf;
    height: 1%;
    margin: 0 0 20px;
    padding: 18px;
    min-height: 115px;
    }
    .box2.alt {
    background: #FFFFFF;
    }
    .box2.alt {
    background: #FFFFFF;
    }
    .comm-name, .comm-date {
    line-height: 20px;
    }
    /*=== Styling Lists ===*/
    /*- List1 -*/
    .list1 li {
    background: url(images/ico-list1.gif) no-repeat 0 1.1em;
    border-bottom: 1px solid #e7e7e7;
    height: 1%;
    padding: .7em 0 .7em 13px;
    }
    .list1 li.last {
    border: 0;
    }
    #rightcol .list1 li a:hover {
    color: #33707e;
    }
    /*=== Styling Forms ===*/
    input.btn {
    background: none;
    border: 0;
    margin: 0;
    padding: 0;
    }
    select {
    padding: 1px;
    }
    /*- Search -*/
    #search {
    float: right;
    height: 25px;
    padding: 31px 0 0;
    }
    #search input {
    background: url(images/search-bgr.gif) repeat-x top;
    border: 1px solid #000000;
    float: left;
    padding: 8px;
    width: 285px;
    }
    #search input.btn {
    background: none;
    border: 0;
    margin: 8px 0 0 -30px;
    padding: 0;
    width: auto;
    }
    /*- Message -*/
    .message div {
    margin: 0 0 18px;
    }
    .message input {
    padding: 9px 15px;
    width: 487px;
    }
    .message textarea {
    height: 114px;
    overflow: auto;
    padding: 9px 15px;
    width: 487px;
    font-family: Verdana;
    }
    .message .submit {
    float: left;
    }
    .message .btn {
    padding: 0;
    width: auto;
    }
    .message .notice {
    color: #a4a4a4;
    float: right;
    font-style: italic;
    padding: 10px 0 0;
    }
    /*=== Pics, Thumbs, Ads etc. ===*/
    .pic img {
    border: 1px solid #cfcfcf;
    display: block;
    margin: 0 0 .8em;
    }
    .pic.fl img {
    margin-right: 23px;
    }
    .pic.fr img {
    margin-left: 23px;
    }
    .th {
    display: block;
    margin: 0 0 .5em;
    }
    .th.fl img {
    margin-right: 10px;
    }
    .th.fl img
    {
    width:40px;
    height:40px;
    border: 1px solid #cfcfcf;
    }
    .ads .odd img {
    margin: 0 10px 10px 0;
    }
    .ads .even img {
    margin: 0 0 10px 0;
    }
    .widget-flickr img {
    margin: 0 14px 15px 0;
    float: left;
    }
    .widget-flickr img {
    border: 1px solid #cfcfcf;
    }
    .widget-flickr #flickr_badge_image3 img,
    .widget-flickr #flickr_badge_image6 img,
    .widget-flickr #flickr_badge_image9 img,
    .widget-flickr #flickr_badge_image12 img,
    .widget-flickr #flickr_badge_image15 img,
    .widget-flickr #flickr_badge_image18 img,
    .widget-flickr #flickr_badge_image21 img,
    .widget-flickr #flickr_badge_image24 img {
    margin-right: 0;
    }
    #twitter ul.tweet_list {
    margin-bottom: 20px;
    }
    #twitter ul.tweet_list li {
    background: url(images/twitter_icon.png) no-repeat top left;
    padding: 0 0 15px 25px;
    margin-bottom: 15px;
    }
    #twitter ul.tweet_list span.date {
    text-transform: uppercase;
    font-size: 10px;
    color: #aaaaaa;
    font-style: italic;
    }
    #twitter a {
    color: #33707e;
    text-decoration: underline;
    }
    #twitter a:hover {
    text-decoration: none;
    }
    /*=== Footer ===*/
    #footer {
    color: #5f5f5f;
    font-size: 11px;
    line-height: 39px;
    margin: 0 auto;
    width: 975px;
    }
    #footer a {
    color: #33707e;
    text-decoration: none;
    }
    #footer a:hover {
    color: #5f5f5f;
    text-decoration: underline;
    }
    #footer ul li {
    display: inline-block;
    margin-left: 15px;
    }

    /*=== Misc. ===*/
    .fix {
    clear: both;
    height: 1px;
    margin: -1px 0 0;
    overflow: hidden;
    }
    .hl, .hl2 {
    background: url(images/hl-dot.gif) repeat-x top;
    clear: both;
    height: 2px;
    overflow: hidden;
    width: 100%;
    }
    .hl2 {
    background: none;
    border-top: 1px solid #e7e7e7;
    height: 1px;
    margin: 0 0 .8em;
    }
    .fl {
    float: left;
    }
    .fr {
    float: right;
    }
    .ac {
    text-align: center;
    }
    .ar {
    text-align: right;
    }

    .entry-content img {
    margin: 0 0 18px 0;
    }
    .alignleft,
    img.alignleft {
    float: left;
    margin-right:20px;
    }
    .alignright,
    img.alignright {
    display: block;
    float: right;
    margin-left:20px;
    }
    .aligncenter,
    img.aligncenter {
    margin-left:auto;
    margin-right:auto;
    display: block;
    clear: both;
    }
    .wp-caption {
    border: 1px solid #ddd;
    text-align: center;
    background-color: #f3f3f3;
    padding-top: 4px;
    margin: 5px 20px 20px 20px;
    /* optional rounded corners for browsers that support it */
    -moz-border-radius: 3px;
    -khtml-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    }
    .wp-caption img {
    margin: 0;
    padding: 0;
    border: 0 none;
    }
    .wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    padding: 0 4px 5px;
    margin: 0;
    }
    .gallery img {
    margin:0;
    }
    .wp-smiley { /* Prevent the smileys from breaking line-height */
    max-height:12px;
    margin:0 !important;
    }

    that css will likely get deleted by a mod. All long blocks of code should go in a pastebin like https://wordpress.pastebin.com

    but that isn’t the issue. the css we can use to align your images, after they show up properly.

    If I visit the link for either button, I can see them in my browser, however neither of them is 140 x 124px….why are you assigning that dimension in your code? If you just use:

    <img src="https://www.relasjonerognettverk.no/wp-content/themes/convergence/images/linkedinbadge.gif" />
    <img src="https://www.relasjonerognettverk.no/wp-content/themes/convergence/images/Facebookbutton.gif" />

    what happens?

    Thread Starter stlastla

    (@stlastla)

    If I just put in that code, both pictures show:) But when I try to add the link tekst the LinkedIn button disapears.

    Take a look at https://www.relasjonerognettverk.no. Now I have just pasted your code.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Html code on sidebar issue’ is closed to new replies.