brentthorne / posterdown

Use RMarkdown to generate PDF Conference Posters via HTML
https://brentthorne.github.io/posterdown_html_showcase/
Other
839 stars 129 forks source link

Sizing of logos #93

Closed jivelasquezt closed 5 years ago

jivelasquezt commented 5 years ago

I'm really struggling to get my logos to be properly scaled in posterdown. Is there any way to control their height and width (e.g. by using {width=90%}). My poster repo is: https://github.com/jivelasquezt/IBSQuito_Poster

brentthorne commented 5 years ago

Hello @jivelasquezt !

To change the size of your logos you can put some css right into the .rmd as there currently isn't support for doing it through the yaml. The default is set to width: 10%; so you can add this anywhere in your .rmd file to change that:

<style>
#main-img-left, #main-img-center, #main-img-right {
 width: 5%;
}
</style>

If you need different sizes for different logos then you can just add them separately:

<style>
#main-img-left {
 width: 5%;
}
#main-img-center {
 width: 7%;
}
#main-img-right {
 width: 10%;
}
</style>
bellewella commented 3 years ago

Hi, I can't figure out how to change the logo size on my poster. I'm using posterdown_html, not betterport. Maybe I'm just not using the correct name to refer to the logo... I don't know where to find that information though unfortunately. I'm very new to CSS and YAML, but I really want to make my own poster in markdown! Any help is appreciated, thank you! Here is my repo: https://github.com/bellewella/myPoster.git

bellewella commented 3 years ago

In a surprising turn of events, I have been able to make some changes to the logos. I read the html page in my github repo, and figured out the logos are called ".logo_left" and ".logo_right". I'm not able to change the size of the images, however, if I increase the size of one image then I can't increase the size of the other. I think they are getting too big, and then pushing the other image out of the page. Is there a way to avoid this? The logos don't really take up enough space to block words or anything. Can I like... get rid of cushioning around the image or something like that?

SvOmmen commented 2 years ago

Hi, thanks for this template!

I'm having the same issue with the logos. The solution given above does not seem to work (anymore?). The only thing I found that changed something was resizing the logo divs. However, when I did so, the title div was pushed to the side and I could not find a way to prevent this (most of my changes to the title div did not seem to have an effect on it).

Do you have any ideas?

Thanks!

spgarbet commented 1 year ago
```{css, echo=FALSE}
div.logo_left{
  width: 20%;
}
div.poster_title{
  width: 70%;
}
pablobernabeu commented 6 months ago

#main-img-left working for me, instead of div.logo_left.