Troubles with CSS in Wordpress

Hey there! I'm currently working on some wordpress tasks and running into an issue with the code. Everything looks good in the first two sections, but the third section is displaying at the top. Please refer to the attached image for a visual of the problem. Any assistance would be greatly appreciated.

[vc_section full_width="stretch_row" parallax="content-moving" parallax_speed_bg="1" css=".vc_custom_1499842858246{padding-top: 45px !important;padding-bottom: 45px !important;background-position: center !important;background-repeat: no-repeat !important;background-size: cover !important;}"][vc_row][vc_column][vc_custom_heading text="HELP THE HOMELESS PEOPLE" font_container="tag:div|text_align:center|color:%23555555" use_theme_fonts="yes" css=".vc_custom_1500283712583{margin-top: 10px !important;}"][vc_custom_heading text="ALONE SHOP PRODUCTS" font_container="tag:h2|font_size:40px|text_align:center|line_height:45px" use_theme_fonts="yes" custom_letter_spacing="-2px" css=".vc_custom_1500275688528{margin-top: 0px !important;margin-bottom: 0px !important;}"][vc_custom_heading text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam," font_container="tag:p|text_align:center" use_theme_fonts="yes" css=".vc_custom_1499843029941{margin-top: 10px !important;margin-bottom: 35px !important;}"][/vc_column][/vc_row]

[vc_row][vc_column width="1/3"]


[vc_featured_box heading_text="Donation" content_text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam" heading_color="#222222" content_color="#444444" graphic="image" graphic_size="100" show_button="show" button_text="JOIN NOW" button_type="circle" image="291"]

[/vc_column][vc_column width="1/3"]

[vc_featured_box heading_text="Volunteers" content_text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam" heading_color="#222222" content_color="#444444" graphic="image" graphic_size="100" show_button="show" button_text="JOIN NOW" button_type="circle" image="291"]

[/vc_column][vc_column width="1/3"][vc_featured_box heading_text="Fundraising" content_text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam" heading_color="#222222" content_color="#444444" graphic="image" graphic_size="100" show_button="show" button_text="JOIN NOW" button_type="circle" image="291"][/vc_column][/vc_row]

https://i.sstatic.net/edxnz.png

htmlcsswordpresswordpress-theming

Answer №1

Experiment with creating a duplicate column to test its functionality. If it works correctly, the issue may lie with the Visual Composer (VC), but if the problem persists, it could be related to your theme. In that case, consider assigning an ID to the div and applying specific styles to that section.

Your theme appears to be functioning properly in this scenario. https://i.sstatic.net/9u3kX.png

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the method for a HTML button to trigger the execution of a Selenium (Java) code located in a remote location through a

I need to run a Selenium Code written in Java from a NAS (Network Attached Storage) or another connected machine. My goal is to create a web page with a button that, when clicked, triggers the execution of the Selenium script located on the connected mac ...

javascripthtmlseleniumuibuttonbuttonclick

Tips for effectively utilizing the display:none property to conceal elements and permanently eliminate them from the DOM

While working on my website, I utilized CSS media queries to hide certain elements by using display: none. Even though this effectively hides the element from view, it still lingers in the DOM. Is there a way to completely eliminate the element from the ...

javascriptjquerycss

What method does Apple use to apply overflow:hidden to elements within position:fixed?

After conducting my own experiments and delving into the topic online, I discovered that elements using position: fixed do not adhere to the overflow: hidden property of their parent element. This also applies to children within the fixed positioned elemen ...

htmlcssoverflowcss-position

CSS Styled Product Index

Currently, I am working on creating a product catalog using React and CSS. Everything is going smoothly except for the last row of products. The issue with the last row is that it only contains 1 element, and due to the flex-grow: 1 setting, it ends up ta ...

htmlcssreactjs

What is the best way to maintain the same height for a textarea and input fields?

What is the best way to align the message input field with the name and phone input fields? I need the height of the message input field to match the combined height of the three inputs on the left. It's crucial that the borders line up perfectly. I ...

htmlcsstwitter-bootstrap

Tips on altering CSS attributes within Magnific Popup

I am currently utilizing the Magnific Popup plugin in my project. The code snippet I have implemented is as shown below: $(".event").magnificPopup({ items: { src: ".hidden-div", type: "inline" ...

jquerycssjquery-pluginspopupmagnific-popup

Retrieve the content outside of the quotation marks in an HTML document through web scraping

I need help extracting specific information from a web page using Python. The data I want is not within quotation marks, as shown below: nummber = page_soup.findAll("span", {"id": "referenznummer"}) nummber # result [<span ...

htmlseleniumweb-scrapingbeautifulsoup

Finding elements using XPath in Selenium

When using Firebug to inspect an input field I need to fill in, I found this code: <label for="form:composite:tabView:ssn">Fødselsnummer</label> In my selenium script, I tried the following: WebElement element = driver.findElement(By.xpath ...

c#htmlseleniumxpath

Improper Placement of Bootstrap 5 Modal

I seem to be facing an unexpected issue where the Bootstrap 5 Modal and other components are displaying inside the sidebar menu instead of the main content area. Has anyone encountered this problem before? How can it be resolved? Here is a test example: ...

htmlcssbootstrap-5

Is it possible to link a NextJS application with my Wordpress site using a proxy, even though they are on separate environments, in order to coexist within the same domain?

I am currently managing a WordPress website that serves as a news blog. One of the features we are implementing is a directory, for which we have chosen to use NextJS for development. The progression of building the directory with NextJS has been smooth ...

wordpressurlnext.jsproxydevops

One approach to animating elements on a web page is by utilizing Node.js

Imagine you want to programmatically define animated movement for elements on a web page. In JavaScript, this can be achieved using techniques outlined in this helpful guide: How TO - JavaScript HTML Animations. But how would you do this in Node.js? UPDAT ...

javascriptjqueryhtmlnode.js

I noticed a significant space below the footer on my webpage. As a first-time website creator, are there any solutions to this

I'm currently in the process of working on my very first website for a study project using HTML and CSS. There's an issue where there is a large gap below the footer that I can't seem to eliminate. I've only completed 3 pages so far, bu ...

htmlcss

The returned response from GraphQL is displaying [Object] instead of the expected data

Recently delving into GraphQL and utilizing it to fetch data from the Wordpress API. While crafting a query in the GraphiQL Wordpress IDE, the data is displayed correctly. However, upon integrating the query into my NEXTJS application and logging the resul ...

reactjswordpressnext.jsgraphql

Combining HTML/CSS to overlay text on an image - EMAIL

Why does Google keep stripping my <style> tag when I try to overlay text on an image? I want the image to be on the left with two text blocks positioned over it on the right (one higher and one lower). It looks fine visually, but when I send it to m ...

htmlcsshtml-email

"Is there a way to align a span element on the same line as an h

I'm attempting to align a text-number (span) next to an entry-title (h2) on the same line, with the entry-meta block on the following line, including having the reading time float left. I could use some help with my CSS implementation. Thank you. Ex ...

htmlcss

Executing the same operation when multiple selections are made from a dropdown menu using jQuery

My dilemma involves a dropdown list featuring options A, B, C, D. I need to implement a functionality where certain input fields are hidden based on the user's selection from the dropdown. I have managed to successfully hide fields when the user sele ...

jqueryhtml

Incorporate a hanging indent within the text enclosed by the <li> element

(revised multiple times to enhance clarity) Disclaimer: I did not create the HTML code. Below is the structure of the HTML (please note that the links and text following them are on the same line): <li> <strong>Heading of section</str ...

javascriptjqueryhtmlcsstext-indent

Ways to modify color while user moves the screen

I'm working with some jQuery code that changes the colors of elements as the user scrolls down, and I want it to revert back to the original color when scrolling back up. However, the script is not behaving as expected... Here is the original working ...

javascriptjqueryhtmlcss

jQuery live DataAttribute manipulation

Here is the code snippet I am working with: <head runat="server"> <title>Sidebar</title> <link href="css/style.css" rel="stylesheet" /> <script src="scripts/jquery-1.11.1.min.js"></script> <script src ...

jqueryhtml

Retrieving the information verified in the database

public function actionEditmul($id) { $sql1="SELECT * FROM category_product INNER JOIN category ON category_product.cat_id=category.cat_id WHERE category_product.product_id=$id"; $editcat=Yii::$app->db->createCommand($sql1)->quer ...

phphtmlyii