Center CSS

  • Resolved cmnthrds

    (@cmnthrds)


    7 years, 1 month ago

    I’ve linked one blog post above, but you can go to any post to see the images.

    I’ve adjusted the CSS, but need a little bit of help.

    1. I’d like less padding between the images.

    2. I’d also like the all four images to be centered. They’re justified to the right. I was able to change margin left to -10 to account for some of it. But I’m sure there’s an easier solution.

    3. How can I make the title closer to the image?

    4. Is there a way to have the .crp_related ulauto adjust the height to be response to the title length?

    I used some of the code available here and messed around with it: https://gist.github.com/ajaydsouza/462b41930c325e6bc345

    Here is what I have now: 

    /* Related Posts */

.crp_related {
	width:100%;
}
.crp_related ul {
	margin-left:-10px;
	height: 250px;
}
.crp_related ul li {
	float:left;
	width:150px;
	list-style:none;
	list-style-position: inside;
	height:180px;
	text-align: left;
	word-wrap:break-word;
}

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Plugin Author Ajay

    (@ajay)

    7 years, 1 month ago

    You can also try the below replacing the one above – this reduces the default margin and default padding. You can try playing with that to see what works to bring them closer

    
.crp_related ul li {
	float:left;
	width:150px;
	list-style:none;
	list-style-position: inside;
	height:180px;
	text-align: left;
	word-wrap:break-word;
        margin: 1px !important;
        padding: 3px !important;
}

    I am not sure how to auto-adjust the height – one thing worth trying is to use this as a base – and choose no-styles in the settings page under Styles

    https://gist.github.com/ajaydsouza/462b41930c325e6bc345#file-crp-titles-below-css

Viewing 1 replies (of 1 total)

The topic ‘Center CSS’ is closed to new replies.