Title: Help me create CSS
Last modified: May 25, 2021

---

# Help me create CSS

 *  Resolved [mryous](https://wordpress.org/support/users/mryous/)
 * (@mryous)
 * [5 years ago](https://wordpress.org/support/topic/help-me-create-css/)
 * Best Plugin sir..!
    Can You help me create CSS for my site using this theme :
   [LINK](https://demo.idtheme.com/wpberita) 1. modulehome-wrap 2. gmr-big-headline
   and 3. .site-main, article.post . or maybe can u give us some example how to 
   using it with theme function – Thanks
    -  This topic was modified 5 years ago by [mryous](https://wordpress.org/support/users/mryous/).

Viewing 10 replies - 16 through 25 (of 25 total)

[←](https://wordpress.org/support/topic/help-me-create-css/?output_format=md) [1](https://wordpress.org/support/topic/help-me-create-css/?output_format=md)
2

 *  Thread Starter [mryous](https://wordpress.org/support/users/mryous/)
 * (@mryous)
 * [5 years ago](https://wordpress.org/support/topic/help-me-create-css/page/2/#post-14501964)
 * thank you sir.. thaank youuuu so muccchhh
    [the third one sir](https://drive.google.com/file/d/1wfi_JUA4m0R3MptGTVFlLLJGXbg7gHGO/view?usp=sharing)
   Youre great 😊
 *  Thread Starter [mryous](https://wordpress.org/support/users/mryous/)
 * (@mryous)
 * [5 years ago](https://wordpress.org/support/topic/help-me-create-css/page/2/#post-14502224)
 * the third sir, tittle and source are in the middle
    [LINK](https://drive.google.com/file/d/1wfi_JUA4m0R3MptGTVFlLLJGXbg7gHGO/view)
 *  Plugin Author [johnzenausa](https://wordpress.org/support/users/johnzenausa/)
 * (@johnzenausa)
 * [5 years ago](https://wordpress.org/support/topic/help-me-create-css/page/2/#post-14503462)
 * Okay. I don’t know where you put the custom css so I’ll just put it here when
   I’m finished.
 *  Plugin Author [johnzenausa](https://wordpress.org/support/users/johnzenausa/)
 * (@johnzenausa)
 * [5 years ago](https://wordpress.org/support/topic/help-me-create-css/page/2/#post-14503713)
 * Okay for the netpost page here is the css (make sure you don’t remove the shortcode_id
   = from the shortcode):
 *     ```
       #modulehome_wrap .netsposts-block-wrapper {
       	display: grid;
       	grid-template-columns: 1fr;
       	gap: 25px;
       }
       #modulehome_wrap .netsposts-block-wrapper .netsposts-content .inline-post {
       	display: grid;
       	grid-template-columns: repeat(auto-fit,minmax(250px,1fr));
       	gap: 25px;
       	align-items: center;
       }
       ```
   
 * If you need anything else please let me know. Like on another page. 🙂
 *  Thread Starter [mryous](https://wordpress.org/support/users/mryous/)
 * (@mryous)
 * [5 years ago](https://wordpress.org/support/topic/help-me-create-css/page/2/#post-14504641)
 * Thank you again sir! got this CSS for that blo0ck
 *     ```
       #modulehome_wrap .netsposts-block-wrapper {
           display: grid;
           grid-template-columns: 1fr;
           gap: 25px;
           margin: 0 25px 0 0;
       }
       #modulehome_wrap .netsposts-block-wrapper .netsposts-content .inline-post {
           display: grid;
           grid-template-columns: 220px 460px 0px 0px;
           gap: 20px;
           align-items: center;
       }
       #modulehome_wrap .netsposts-posttitle-link {
           font-family: Montserrat;
           font-size: 20px;
           line-height: 1.3;
       }
       #modulehome_wrap .netsposts-posttitle-link:hover {
           color: #21409a;
       }
       #modulehome_wrap .netsposts-source {
           font-size: 13px;
           line-height: 14px;
           color: var(--content-greycolor, #888888);
       }
       #modulehome_wrap .netsposts-source-link {
           font-size: 13px;
           line-height: 14px;
           color: var(--content-greycolor, #888888);
       }
       #modulehome_wrap .link-img-wrapper {
           order: 0;
           display: block;
           overflow: hidden;
           border-radius: 4px !important;
           transition: .3s;
       }
       #modulehome_wrap .link-img-wrapper .post-thumbnail {
           display: block;
           transition: .2s all ease-in-out;
       }
       #modulehome_wrap .link-img-wrapper:hover .post-thumbnail {
           transform: scale(1.2);
       }
       ```
   
 * currently I’m trying to set the responsive part,
    then I’ll try to apply it to
   other blocks as well 😊 You’re the best. I wouldn’t have finished this without
   you sir!!
 *  Plugin Author [johnzenausa](https://wordpress.org/support/users/johnzenausa/)
 * (@johnzenausa)
 * [5 years ago](https://wordpress.org/support/topic/help-me-create-css/page/2/#post-14504946)
 * Hi [@mryous](https://wordpress.org/support/users/mryous/) ;
 * This is for the following css:
 * `#modulehome_wrap .netsposts-block-wrapper .netsposts-content .inline-post`
 * I was looking at your css code and see you changed it to:
 * `grid-template-columns: 220px 460px 0px 0px;`
 * You don’t need 0px just make it look like this:
 * `grid-template-columns: 220px 460px;`
 * plus you said you would like to keep it responsive. Since 460/220 equals 2.09
   which is close enough to 2 and to have it automatically responsive when the screen
   is shrunk you should really have:
 * `grid-template-columns: 1fr 2fr;`
 * and you will see the difference is negligible. Then around 600px it would look
   better in a single column. So switching over from grid to flex would be your 
   best choice. Just enter the below code below the code you have pasted already:
 *     ```
       @media screen and (max-width:600px) {
       	#modulehome_wrap .netsposts-block-wrapper .netsposts-content .inline-post {
       		display: flex;
       		flex-direction: column;
       		align-items: center;
       	}
       }
       ```
   
 * With that all said if you’d like you can replace **your above code** with the
   code below (I’ve already made the changes for you 🙂 then you can dismiss all
   the code I’ve written above and just go with the code below. Remember to replace
   all your code above :-):
 *     ```
       #modulehome_wrap .netsposts-block-wrapper {
           display: grid;
           grid-template-columns: 1fr;
           gap: 25px;
           margin: 0 25px 0 0;
       }
       #modulehome_wrap .netsposts-block-wrapper .netsposts-content .inline-post {
           display: grid;
           grid-template-columns: 1fr 2fr;
           gap: 20px;
           align-items: center;
       }
       #modulehome_wrap .netsposts-posttitle-link {
           font-family: Montserrat;
           font-size: 20px;
           line-height: 1.3;
       }
       #modulehome_wrap .netsposts-posttitle-link:hover {
           color: #21409a;
       }
       #modulehome_wrap .netsposts-source {
           font-size: 13px;
           line-height: 14px;
           color: var(--content-greycolor, #888888);
       }
       #modulehome_wrap .netsposts-source-link {
           font-size: 13px;
           line-height: 14px;
           color: var(--content-greycolor, #888888);
       }
       #modulehome_wrap .link-img-wrapper {
           order: 0;
           display: block;
           overflow: hidden;
           border-radius: 4px !important;
           transition: .3s;
       }
       #modulehome_wrap .link-img-wrapper .post-thumbnail {
           display: block;
           transition: .2s all ease-in-out;
       }
       #modulehome_wrap .link-img-wrapper:hover .post-thumbnail {
           transform: scale(1.2);
       }
       @media screen and (max-width:600px) {
       	#modulehome_wrap .netsposts-block-wrapper .netsposts-content .inline-post {
       		display: flex;
       		flex-direction: column;
       		align-items: center;
       	}
       }
       ```
   
    -  This reply was modified 5 years ago by [johnzenausa](https://wordpress.org/support/users/johnzenausa/).
      Reason: switching from grid to flex
    -  This reply was modified 5 years ago by [johnzenausa](https://wordpress.org/support/users/johnzenausa/).
    -  This reply was modified 5 years ago by [johnzenausa](https://wordpress.org/support/users/johnzenausa/).
 *  Thread Starter [mryous](https://wordpress.org/support/users/mryous/)
 * (@mryous)
 * [5 years ago](https://wordpress.org/support/topic/help-me-create-css/page/2/#post-14508349)
 * You are right sir.., I’ve changed all my code and use yours 😁
    it’s woooork …
   except the responsive 😊 [RESPONSIVE SCREEN](https://drive.google.com/file/d/1Z3X8naOOFsypitA51qYeKAKLfihPf675/view?usp=sharing)
   Your code is in the left of the attachment sir, on the right side is what Im 
   tryng to. . oh yeah I forgot something sir, do you see the red text on the content
   in the attachment? It’s a post topic, (class=”gmr-meta-topic heading-text”) the
   theme author provide it it would be awesome if your plugin can shows that Any
   way.. Still thanks to you sir
    -  This reply was modified 5 years ago by [mryous](https://wordpress.org/support/users/mryous/).
 *  Plugin Author [johnzenausa](https://wordpress.org/support/users/johnzenausa/)
 * (@johnzenausa)
 * [5 years ago](https://wordpress.org/support/topic/help-me-create-css/page/2/#post-14508382)
 * Okay give me another day. Just looks squished when too small.
 *  Thread Starter [mryous](https://wordpress.org/support/users/mryous/)
 * (@mryous)
 * [5 years ago](https://wordpress.org/support/topic/help-me-create-css/page/2/#post-14508466)
 * Nevermind sir.. All your help these days, What a thoughtful gift for me. I really
   appreciate this!
    Thanks A Trillion sir!!
 *  Plugin Author [johnzenausa](https://wordpress.org/support/users/johnzenausa/)
 * (@johnzenausa)
 * [5 years ago](https://wordpress.org/support/topic/help-me-create-css/page/2/#post-14508616)
 * [@mryous](https://wordpress.org/support/users/mryous/) Sir;
 * Okay glad you’re all set up. Will mark this as resolved.

Viewing 10 replies - 16 through 25 (of 25 total)

[←](https://wordpress.org/support/topic/help-me-create-css/?output_format=md) [1](https://wordpress.org/support/topic/help-me-create-css/?output_format=md)
2

The topic ‘Help me create CSS’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/network-posts-extended_b4775d.svg)
 * [Network Posts Extended](https://wordpress.org/plugins/network-posts-extended/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/network-posts-extended/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/network-posts-extended/)
 * [Active Topics](https://wordpress.org/support/plugin/network-posts-extended/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/network-posts-extended/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/network-posts-extended/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [function](https://wordpress.org/support/topic-tag/function/)

 * 25 replies
 * 2 participants
 * Last reply from: [johnzenausa](https://wordpress.org/support/users/johnzenausa/)
 * Last activity: [5 years ago](https://wordpress.org/support/topic/help-me-create-css/page/2/#post-14508616)
 * Status: resolved