How to create parallel buttons

I have been experimenting with different methods to align these two buttons in a parallel manner. However, I have come to realize that the buttons only align properly when I remove the html.beginform tag. Unfortunately, I cannot remove this tag. Can you please guide me in the right direction?

Here is the HTML code:

<div class="row">
    <div class="col-md-6"></div>
    <div class="col-md-6">
        @using (Html.BeginForm("ExportExcel", "SalesByBranch", FormMethod.Post@*, new { enctype = "multipart/form-data" }*@))
        {
            <input type="submit" value="Excel" id="btnExcel" class="btn btn-danger btn-sm form-control" onclick=DataCheck(); style="width:80px;height:30px;" />
        }
        @using (Html.BeginForm("ExportPDF", "SalesByBranch", FormMethod.Post@*, new { enctype = "multipart/form-data" }*@))
        {
            <input type="submit" value="PDF" id="btnPDF" class="btn btn-danger btn-sm form-control" onclick=DataCheck(); style="width:80px;height:30px;" />
        }
    </div>
</div>

View the photo here

I appreciate your assistance in advance.

Answer №1

Enclose the buttons in a div that has this specific styling:

display: inline-block;

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

Equalize the color of overlapping background events with non-overlapping background events in fullcalendar

events:[ {overlap:false, display:'background', start:'2021-12-23 10:15:00', end:'2021-12-23 10:30:00'}, {overlap:false, display:'background', start:'2021-12-23 10:30:00', end:'2021-12-23 10:45:00&a ...

Carousel King with never-ending content

Is there a way to create a carousel in Bootstrap 4 where the carousel items are not separated but visible concurrently? In other words, can carousel item 2 and 3 appear while the first item is still visible? I've included an image for reference: http ...

Incorporating HTML5 audio elements in JavaScript

I am working on a project where I need to create a grid of 16 audio files with separate links for each in HTML, CSS and JavaScript. Each box in the grid should link to a different audio file. My initial thought was to use a table to achieve this, so I cre ...

When hovering over the main menu, the submenu appears hidden behind it

I am struggling with setting up a dropdown submenu on my website that uses a responsive Joomla template. The submenu always appears behind the main menu and slider, despite trying z-index and relative positioning. Can anyone help me figure out what I' ...

Pictures failing to load within the canvas

I am currently in the process of creating a very basic canvas element. The idea is to allow users to choose between two images and have their selection appear on the canvas when clicked. However, I am facing some challenges with making it work. I have ver ...

Is the content within the div not displaying fully?

I'm working on a one-page website using Bootstrap columns, but I've encountered an issue. When I shrink the screen, the content of a form that is positioned absolutely doesn't fully appear. How can I ensure that the second column adjusts its ...

During my JavaScript coding session, I encountered an issue that reads: "Uncaught TypeError: $(...).popover is not a function". This

Encountering an issue while trying to set up popovers, as I am receiving this error: Uncaught TypeError: $(...).popover is not a function. Bootstrap 5 and jQuery links are included in the code, but despite that, the functionality is still not operational. ...

Techniques for invoking the parent function from a child button

Imagine having a versatile component named ButtonComponent that needs to be used in different parts of the application. To ensure maximum flexibility, the component is designed as follows: button.component.ts import { Component, ViewEncapsulation, Input, ...

Toggle the Bootstrap navbar class based on the current scroll position

I'm currently working on the development of a website that includes a feature where a static navbar transforms into a fixed navbar after scrolling down 500px. The transition from "navbar-static-top" to "navbar-fixed-top" is functioning properly. Howev ...

How come it functions with $scope but fails with `this`?

I am trying to figure out why my code only works with scripts 1 and 3, but not with script 2. I need this functionality for my project because I can't use $scope. Thank you!! <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19 ...

Ways to create a noticeable effect on an image button when hovering without causing a shift in the position

Check out my simple script here: http://jsfiddle.net/PA9Sf/ I am looking to make a specific button stand out when hovered over without affecting the position of other buttons on the page. The current implementation in the provided jsfiddle moves the butto ...

Jump to a specific section on a different page when the links are already equipped with anchors for smooth scrolling

My website has a menu on the home page that scrolls to specific id positions: <li><a href="#event-section">El evento</a></li> <li><a href="#asistentes-section">Asistentes</a></li> <li><a href="#cont ...

What is the best way to handle the select event for a jQuery UI autocomplete when there are images involved?

Looking for help with creating an autocomplete feature with images on this jsfiddle. Despite trying to capture the event when a user selects an image, it doesn't seem to work properly: $("#input").autocomplete({ //source: tags, so ...

Using data fetched from PHP in HTML via jQuery post: A step-by-step guide

I have created a function in jQuery that uses $.post to send data to a PHP file. The query in the PHP file is working fine and returning the data back successfully. JavaScript code: function send_agenda_data(cidade_data){ var data = {'cidade_dat ...

Tips for choosing an item within a div -> ul -> li using Selenium

I need help with a menu that displays a list on mouse hover, and I'm trying to click on "Logout". However, the code I've written so far is not giving me the desired result. This is the Java code I have: public void logout() throws Exception { ...

What is the best way to create a CSS grid with horizontal overflow?

I'm currently working on a 4-column layout using CSS grid. As the browser width reaches a specific breakpoint, I want the first column to be fixed on the left side of the browser (X-axis) while the other columns scroll under it. Right now, I am utiliz ...

Tips for capturing the dx dy SVG attribute using CSS

Seeking advice on the most effective way to access the dx dy SVG attribute in CSS. If this is not feasible, what would be the best approach in JavaScript? ...

Numerous text boxes sharing identical IDs

Here is the code snippet that I am working with: <%for (int index = 1; index < 7; ++index) {%> <tr> <td> <div class="indicacao_gdp"> ...

Trouble with Selecting an un-ordered list menu item in Selenium Java's side bar navigation

Exploring a different approach to selecting a menu item in the sidebar navigation within an iframe. After switching to the iframe, I am attempting to choose a specific item from the side menu to display its respective navigational items for selection. Thes ...

HTML code displayed on the chat interface

Is there a way or some JavaScript/HTML code to block HTML and cone files from appearing in a chat box when writing HTML code? When I input HTML code in the text box, it appears as is. How can I prevent this? Is there a specific code to use? Below is an e ...