[Resolved] Blocks inside sections

Home Forums Support [Resolved] Blocks inside sections

Home Forums Support Blocks inside sections

Viewing 15 posts - 1 through 15 (of 18 total)
  • Author
    Posts
  • #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?
    Thanks

    Best wishes.
    From Balaguer, near of Barcelona

    #1116189
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    I would use a different selector other than container – maybe block-container?

    Then you could do this:

    .block-container {
        display: flex;
    }
    
    .block-container a {
        width: 33%;
    }
    #1116260
    rafel 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 Barcelona

    #1116349
    Leo
    Staff
    Customer Support
    #1116827
    rafel 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 Barcelona

    #1116918
    Leo
    Staff
    Customer Support

    Your 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-css

    We can only help with theme related questions and not general HTML tutorials.

    #1117185
    rafel 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 block

    Thanks and stay in touch

    Best wishes.
    From Balaguer, near of Barcelona

    #1117655
    Tom
    Lead Developer
    Lead Developer

    Have 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.

    #1117688
    rafel 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 Barcelona

    #1117942
    Tom
    Lead Developer
    Lead Developer

    When 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.

    #1119528
    rafel 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 Barcelona

    #1120113
    Tom
    Lead Developer
    Lead Developer

    I’m not sure I understand – are we talking about the Google Ads section? If so, it looks centered to me.

    #1120179
    rafel jesus

    Yes Google Ads section, centered the greenbox.

    Best wishes.
    From Balaguer, near of Barcelona

    #1120447
    Tom
    Lead Developer
    Lead Developer

    Here’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 🙂

    #1120531
    rafel 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/7lbjQUxsXyq
    https://www.screencast.com/t/qZmHDeKya

    Thanks

    Best wishes.
    From Balaguer, near of Barcelona

Viewing 15 posts - 1 through 15 (of 18 total)
  • You must be logged in to reply to this topic.