Transparent colums

• 

  urs69 · Member · Apr 10, 2016 at 11:17 am

  • Copy link
  • Add topic to favorites

  Hi. Anybody may can help with a css code for a 5 column transparent or semitransparent colum boxes next to each other in a wordpress section. 5 different Provider which can highlight their products in that box.. Should be a Link possible when i click on the box t o that provider..
  Thx. in advance for your help

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Apr 12, 2016 at 12:33 am

  • Copy link

  Hi, I don’t see that you have the WordPress.com Premium Plan upgrade, so with the Edin theme you are using, you would need to use the full-width page template which gives you 930px of content width.

  You would need to have a parent div and then each of the images/links would be put into their own div within that div. The basic structure would look like this, and you will be doing the bulk of the work in the page editor Text tab so that you can enter the HTML.

  <div>
  <div style="width: 18%; padding-right: 10px;>First image/link</div>
  <div style="width: 18%; padding-right: 10px;>Second image/link</div>
  <div style="width: 18%; padding-right: 10px;>Third image/link</div>
  <div style="width: 18%; padding-right: 10px;>Fourth image/link</div>
  <div style="width: 18%; padding-right: 10px;>Fifth image/link</div>
  </div>

  With the above, this is going to mean the images aren’t going to be very wide, and to really do this right would require some custom CSS.

  What might be better would be to use the Grid Page template, but you will only be able to use 3 across. You would then set up Child pages for each of the people.

  One last thing I’ll offer – and I don’t know that you are intending to do this – but there is a limit on what can and cannot be done here at WordPress.com as far as advertising goes, and if you are going to get paid for the placements on your site, you will want to review this support page: https://en.support.wordpress.com/advertising/. If you have any questions on advertising and such, you can use the Contact Form and discuss this with our Terms of Service team.