Crunched text when using div

Calion
Calion

 For some reason, all oft my text that was surrounded in <div> tags has lost its line spacing. I don't think it was something I did; I think it was some change in the site in some past year that messed things up. Perhaps it interacted badly with my existing CSS. 

Here is an example of the scrunched text: http://sydarksun.obsidianportal.com/wikis/setting-information

And here's all the CSS I'm using. 

/* CHARACTER STYLING */

.smallcaps {

    font-variant: small-caps;

}

/* HEADER STYLING */

h3 {

font-variant: small-caps;

}



/* BLOCKQUOTE STYLING */

/* from http://forums.obsidianportal.com/comments.php?DiscussionID=3615 */

.campaign-public-layout blockquote {border-left: transparent; font-style: italic; font-family: 'Jura';  }

.campaign-public-layout blockquote p {color: dimgray;}

/*WIDEN TEXT AREA*/

/* From https://forums.obsidianportal.com/discussion/comment/26440/#Comment_26440*/

/*.main-content-container {

width:825px !important;

}

.character-avatar {

overflow:hidden;

}

.sidebar-adventure-log-neighbors {

overflow:hidden;

}

img {

max-width:none;

}

#sidebar {

width:20px;

z-index:2;

position:absolute;

left:980px;

background:#454545;

height:100%;

}

#sidebar:hover {

width:250px;

z-index:2;

position:absolute;

left:760px;

background:#202020;

}

.module {

overflow:hidden;

}

.sidebar-last-updated {

overflow:hidden;

}/*

Comments

  • cgregory
    cgregory
    Posts: 779

    A quick look of your campaign seems to show that you sometimes forget to close off your divs.

    You can see that in your adventure logs list.  session 18 likely doesn't have a closing div. session 8 also. 

    http://sydarksun.obsidianportal.com/adventure-log

    The squished text has usually been an issue of a incorrectly formed tag rather than css

     

    They are among us!

    image

                       XCom: Defiance - Campaign of the Month November 2016

     

     

  • cgregory
    cgregory
    Posts: 779

    Now that I'm in front of a computer and looked at that page.  You seem to be using divs tags as p tags. Any reason for that? I know you are adding indents on some of them, but you can do that with a p tag also.

    <div style="text-indent:20px;">

    <p style="text-indent:20px;">

    Div tags don't have any text formatting CSS of their own so they default to the body css which has a line height of 1 rather than p tags which do have CSS assigned with a line height of 1.6

    line-height: 1.6;

     

     

    They are among us!

    image

                       XCom: Defiance - Campaign of the Month November 2016

     

     

  • Calion
    Calion
    Posts: 144

    Thanks. I was using div because that was suggested somewhere a long time ago. I'll change it.

Sign In or Register to comment.

July 2022
Signs and Portends

Read the feature post on the blog
Return to Obsidian Portal

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Discussions