- This topic has 17 replies, 4 voices, and was last updated 1 year ago by
David.
-
AuthorPosts
-
December 28, 2019 at 3:21 am #1115811
rafel jesus
Hi there.
I would like puy inside a section three blocks, now I have three blocks but in vertical but it is not correct I would like in horizontal, I put code in Html in the section and CSS in style, there are these.<html> <head> <title>Posicionamento de cajas - Francesc Ricart</title> <meta charset="utf8"> <style> </style> </head> <body> <div class="container"> <a href="" class="caixa-1">1</a> <a href="" class="caixa-2">2</a> <a href="" class="caixa-3">3</a> </div> </body> </html>
and CSS
.container{ max-width:800px; } a[class|="caixa-1"]{ position:static; display:inline-block; text-decoration:none; width:425px; height:425px; margin:1px; padding:0px; border:0px solid #666; background-color:#f9f5e3; color:#ffffff; } a[class|="caixa-2"]{ position:static; display:inline-block; text-decoration:none; width:425px; height:425px; margin:1px; padding:0px; border:0px solid #666; background-color: #27ae60; color:#ffffff; } a[class|="caixa-3"] { position:static; display:inline-block; text-decoration:none; width:425px; height:425px; margin:1px; padding:0px; border:0px solid #666; background-color: #ba4a00; color:#ffffff; }
And I have that
Can you help me? Where is the mistake?
ThanksBest wishes.
From Balaguer, near of BarcelonaDecember 28, 2019 at 8:57 am #1116189Tom
Lead DeveloperLead DeveloperHi there,
I would use a different selector other than
container
– maybeblock-container
?Then you could do this:
.block-container { display: flex; } .block-container a { width: 33%; }
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentDecember 28, 2019 at 11:05 am #1116260rafel jesus
Hi @Tom.
Perfect more o less, but if I want to put picture and text inside of every block, how can I do?Best wishes.
From Balaguer, near of BarcelonaDecember 28, 2019 at 2:30 pm #1116349Leo
StaffCustomer SupportYou’d need to use HTML img tag:
https://www.w3schools.com/tags/tag_img.aspDocumentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/December 29, 2019 at 8:03 am #1116827rafel jesus
HI Leo.
I put html code in sections and css in style.css, but it’s doesn’t work<html> <body> <a href="" class="caixa-1">1</a><img src="formacio.jpg" alt="Formació" height="425" width="425"> <a href="" class="caixa-2"></a> <a href="" class="caixa-3"></a> </div> </body> </html>
Best wishes.
From Balaguer, near of BarcelonaDecember 29, 2019 at 11:02 am #1116918Leo
StaffCustomer SupportYour image src needs to be the full link to the file.
Doesn’t look like you are very comfortable with HTML so it might be easier to consider using a block plugin like GhostKit or Kadence block to replace Sections + HTML?
Another good option is to use a page builder like beaver builder or elementor.
It will make your life much easier 🙂
Or you will need to go through a course like this one:
https://www.codecademy.com/catalog/language/html-cssWe can only help with theme related questions and not general HTML tutorials.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/December 29, 2019 at 11:55 pm #1117185rafel jesus
Hi Leo.
Your image src needs to be the full link to the file.
I put the full link and it doesn’t work
Doesn’t look like you are very comfortable with HTML so it might be easier to consider using a block plugin like GhostKit or Kadence block to replace Sections + HTML?
Another good option is to use a page builder like beaver builder or elementor.
It will make your life much easier
Maybe my life is easier but I want to learn to make without a page builder the site is faster with less plugins.
I tried to work with GhostKit or Kadence but I didn’t find a block with this structure.Section/block put inside three or more blocks and inside every block put background image, text with a link, etc
In fact, all pages were made with block, but the main was made with sections.
Perhaps in the future, the sections will work with Gutenberg’s blockThanks and stay in touch
Best wishes.
From Balaguer, near of BarcelonaDecember 30, 2019 at 9:36 am #1117655Tom
Lead DeveloperLead DeveloperHave you tried using the Columns block along with the Cover block? They’re both core Gutenberg blocks and should do what you’re looking for.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentDecember 30, 2019 at 10:07 am #1117688rafel jesus
Hi Tom, yes I tried on some page I worked with columns, but it didn’t work in section I made the main page with sections.
Thanks.Best wishes.
From Balaguer, near of BarcelonaDecember 30, 2019 at 4:32 pm #1117942Tom
Lead DeveloperLead DeveloperWhen you say Sections, do you mean the GP Premium module? If so, that would require some HTML/CSS knowledge to set up – I think it would be much easier to go the Gutenberg route. You can use the “Group” block to set up your sections.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJanuary 1, 2020 at 11:55 pm #1119528rafel jesus
Hi there
in the last section of my website at the end there is a possibility that the green box is centered, as you can see when uploading the whole section is hidden, is it possible?
Thanks
Best wishes.
From Balaguer, near of BarcelonaJanuary 2, 2020 at 10:00 am #1120113Tom
Lead DeveloperLead DeveloperI’m not sure I understand – are we talking about the Google Ads section? If so, it looks centered to me.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJanuary 2, 2020 at 10:56 am #1120179rafel jesus
Yes Google Ads section, centered the greenbox.
Best wishes.
From Balaguer, near of BarcelonaJanuary 2, 2020 at 5:33 pm #1120447Tom
Lead DeveloperLead DeveloperHere’s what I’m seeing right now: https://www.screencast.com/t/pcwVdUtVF
Are you wanting to make it less wide, maybe?
Let me know 🙂
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJanuary 2, 2020 at 9:49 pm #1120531rafel jesus
Hi Tom
No, you can see in the last section Google Ads when the scroll finish the green box disappear, there is any way what the green box move while the section move until the final and stay centered.
same like that
https://www.screencast.com/t/qZmHDeKyaThanks
Best wishes.
From Balaguer, near of Barcelona -
AuthorPosts
- You must be logged in to reply to this topic.