BUCKY
New Member
onlinescalemodelers.proboards.com; moparsinscale.proboards.com
Posts: 141
inherit
169862
0
Mar 7, 2024 13:00:14 GMT -8
BUCKY
onlinescalemodelers.proboards.com; moparsinscale.proboards.com
141
August 2011
bucky
|
Post by BUCKY on Feb 27, 2020 11:26:55 GMT -8
I installed the container formula and codes on the ONLINESCALEMODELERS forum. I think it looks great! I may experiment with some colors and sizes, but I really like it. Thanks, so much for the help!
|
|
inherit
252032
0
Sept 18, 2023 9:07:51 GMT -8
Retread
Tribbial Pursuit.
5,014
January 2018
retread
|
Post by Retread on Feb 27, 2020 18:34:50 GMT -8
Hey BUCKY , feel free to experiment and work toward making things suit your personal tastes. Also, I noticed an error I made in the styling. I used max-width in a situation where I should have used width. That means the sizes of the images won't track properly when the viewport is large enough that an image doesn't fully cover the width allotted. I corrected that. Also, for the image pair you're using for onlinescaleremodelers, the left width should be 57.3% and the right 42.7% if you want the images to have the same height. I made the corrections here, so you can copy and paste if you like: <link href="https://fonts.googleapis.com/css?family=Courgette|Open+Sans&display=swap" rel="stylesheet"> <style> .awards-outer{ font-family:Open Sans; font-weight:bold; font-size:1.1vw; text-align:center; color:#aaaaaa; background-color:#333333; border-radius:0.4vw;-moz-border-radius:0.4vw;-webkit-border-radius:0.4vw; padding:1.5vw;margin:auto; box-shadow:inset 0vw 0vw 1.1vw 0.8vw rgba(77, 181, 255, 0.9); margin-bottom:10px; } .awards-outer h1{ font-family:Courgette; font-size:200%; color:#cc9933; } .awards-outer h2{ font-family:Palatino Linotype; font-size:120%; margin-bottom:0.25vw; } .awards-outer i{ font-family:Courgette; font-weight:normal; margin-left:2em; } .awards-outer img{ width:100%; } .awards-left{ float:left; width:57.3%; } .awards-right{ float:left; width:42.7%; } .awards-left div{ margin:0vw 0.25vw 0.5vw 0.5vw; } .awards-right div{ margin:0vw 0.5vw 0.5vw 0.25vw; } .clr{ clear:both; } </style>
<div class="awards-outer"> <h1> Model Of the Month & Model Of The Year </h1> <div class="awards-left"> <div> <h2> FEBRUARY, 2020 MODEL OF THE MONTH </h2> <img src=" i.ibb.co/t2wc0F6/bvd1.jpg " title=""> <p> Trumpeter T80BVD <i>by</i> OGREJOHN </p> </div> </div> <div class="awards-right"> <div> <h2> 2019 MODEL OF THE YEAR </h2> <img src=" images34.fotki.com/v1605/photos/5/1742225/9386022/_DSC0030b-vi.jpg " title="" width="inherit" height="inherit"> <p> "Calm Before The Storm" <i>by</i> STEVE SKI </p> </div> </div> <div class="clr"></div> </div>
|
|
BUCKY
New Member
onlinescalemodelers.proboards.com; moparsinscale.proboards.com
Posts: 141
inherit
169862
0
Mar 7, 2024 13:00:14 GMT -8
BUCKY
onlinescalemodelers.proboards.com; moparsinscale.proboards.com
141
August 2011
bucky
|
Post by BUCKY on Mar 31, 2020 15:50:42 GMT -8
Hi, Retread!
Can you tell me how to change the color of the text in these sections?
FEBRUARY, 2020 MODEL OF THE MONTH
</h2>
<img src="
i.ibb.co/t2wc0F6/bvd1.jpg
" title="">
<p>
Trumpeter T80BVD <i>by</i> OGREJOHN
</p>
</div>
</div>
<div class="awards-right">
<div>
<h2>
2019 MODEL OF THE YEAR
</h2>
<img src="
images34.fotki.com/v1605/photos/5/1742225/9386022/_DSC0030b-vi.jpg
" title="" width="inherit" height="inherit">
<p>
"Calm Before The Storm" <i>by</i> STEVE SKI
</p>
</div>
</div>
<div class="clr"></div>
</div>
|
|
inherit
252032
0
Sept 18, 2023 9:07:51 GMT -8
Retread
Tribbial Pursuit.
5,014
January 2018
retread
|
Post by Retread on Mar 31, 2020 18:57:59 GMT -8
Hi, Retread! Can you tell me how to change the color of the text in these sections? Hey BUCKY, The text color for everything is in the first portion of the internal style sheet. Under (.awards-outer) you'll see color:#aaaaaa; That's the light grey. The text color for the Main Heading is in under (.awards-outer h1) that's color:#cc9933; I added a section to the internal style sheet to allow you to apply colors to each of four different areas, if so desired. At the moment, they are all defined as inherit which will cause them to pick up the #aaaaaaa from the outer container. You can change those. </script><link href="https://fonts.googleapis.com/css?family=Courgette|Open+Sans&display=swap" rel="stylesheet"> <style> .awards-outer{ font-family:Open Sans; font-weight:bold; font-size:1.1vw; text-align:center; color:#aaaaaa; background-color:#333333; border-radius:0.4vw;-moz-border-radius:0.4vw;-webkit-border-radius:0.4vw; padding:1.5vw;margin:auto; box-shadow:inset 0vw 0vw 1.1vw 0.8vw rgba(77, 181, 255, 0.9); margin-bottom:10px; } .awards-outer h1{ font-family:Courgette; font-size:200%; color:#cc9933; } .awards-outer h2{ font-family:Palatino Linotype; font-size:120%; margin-bottom:0.25vw; } .awards-outer i{ font-family:Courgette; font-weight:normal; margin-left:2em; } .awards-outer img{ max-width:100%; } .awards-left{ float:left; width:57.3%; } .awards-right{ float:left; width:42.7%; } .awards-left div{ margin:0vw 0.25vw 0.5vw 0.5vw; } .awards-right div{ margin:0vw 0.5vw 0.5vw 0.25vw; } /****************** Independent Text Colors *************************/ /* Left Heading */ .awards-left h2{ color:inherit; } /* Left Below image */ .awards-left p{ color:inherit; } /* Right Heading */ .awards-right h2{ color:inherit; } /* Right Below image */ .awards-right p{ color:inherit; } .clr{ clear:both; } </style>
<div class="awards-outer"> <h1> Model Of the Month & Model Of The Year </h1> <div class="awards-left"> <div> <h2> APRIL, 2020 MODEL OF THE MONTH </h2> <img src=" images46.fotki.com/v677/photos/1/1319407/6089000/DSC03782-vi.jpg "> <p> 1977 FORD ECONOLINE <i>by</i> BUCKY </p> </div> </div> <div class="awards-right"> <div> <h2> 2019 MODEL OF THE YEAR </h2> <img src=" images34.fotki.com/v1605/photos/5/1742225/9386022/_DSC0030b-vi.jpg "> <p> "Calm Before The Storm" <i>by</i> STEVE SKI </p> </div> </div> <div class="clr"></div> </div>
|
|
BUCKY
New Member
onlinescalemodelers.proboards.com; moparsinscale.proboards.com
Posts: 141
inherit
169862
0
Mar 7, 2024 13:00:14 GMT -8
BUCKY
onlinescalemodelers.proboards.com; moparsinscale.proboards.com
141
August 2011
bucky
|
Post by BUCKY on Mar 31, 2020 20:00:14 GMT -8
Thank you, so much! I should be able to dress things up a bit differently for each forum, now. I appreciate the help!
|
|