Showing ASP code within a DIV element (inline)

Working on setting up a 'shopping cart' feature on our website, but running into some issues with the ASP code. Does anyone have any advice to offer?

In the image below, you can see that when items are added to the cart, the 'total' is displayed on the second line. I would like everything to appear on the same line. Could someone point out what might be wrong in my code causing this issue?

If you want to check it out yourself, feel free to visit the page here: Add the item listed to your cart and notice how the total gets moved to the second line...

Thank you in advance for any help!

cssasp-classic

Answer №1

There are two CSS elements that are causing the text to break onto a new line

#pcIconBarLeft a {
   text-decoration: none;
   color: #06F;
   /*display: inline-block;*/
}
#pcIconBar a {
   text-decoration: none;
   color: #666;
   /*display: inline-block;*/
}

Remove the display: inline-block; from both of those elements if you want the entire text to be on the same line.

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

My webpage is struggling to locate the CSS stylesheet

Regarding the index file: <link rel="stylesheet" href="css/stylesheet.css"/> Everything seems to be working fine here. However, the rest of my html documents are located in a folder called "pages". I'm facing an issue where it can't loca ...

htmlcss

Issues are arising with CSS .not(selector) functionality when applied to a span element

One of the challenges I'm facing is formatting a header with a span tag that contains a date and some accompanying text. The goal is to make the text bold without affecting the formatting of the date. In my CSS file, I have tried using :not(cls) to t ...

htmlcss

Steps for choosing an image and embedding it within a div element

Upon loading the site, an image is displayed with the following code: <img id="some_Image" src="some_source"> However, I am looking to avoid requesting this image again from "some_source". This is because calculating the image can be resource-inten ...

javascriptjqueryhtmlcss

CSS photo display with magnification feature

I currently have a functioning inner-zoomable image set up with the code provided. I am interested in converting this setup into an image gallery with zoom capabilities for the selected image element, but I'm unsure where to start. My objective is to ...

javascriptjqueryhtmlcssimage

ReactJS Navbar component experiencing CSS hover bug

While developing a navbar component in React, I encountered an unexpected issue - the hover effect on my navigation links suddenly stopped working. Strangely enough, the cursor: pointer functionality still operates on my logo but not on the nav links durin ...

htmlcssreactjsweb-deploymentreact-component

PHP: Bootstrap CSS for Carousels

I'm experiencing some difficulties with the Bootstrap CSS Carousel on my website. The left and right arrows seem to be unresponsive, and the slides are not transitioning automatically. I have been unable to identify the root cause of this issue. Belo ...

phpjavascriptcsstwitter-bootstrapcarousel

Error Encountered in Laravel 5.2 FormBuilder.php

Encountering Laravel 5.2 ErrorException in FormBuilder.php on line 1235 stating that the method 'style' does not exist. This error has me perplexed. I have already made updates to my composer.json file by adding "laravelcollective/html": "^5.2" ...

phpcsslaravel-5

Shadow border added to each div creates a unique navigation tab for easy access

#container { position: fixed; height: 100%; left: 0px; right: 0px; top: 0px; width: 10%; background-color: blue; } #container>div {} <html> <div id="container"> <div>up</div> <div>down</div> <d ...

htmlcss

What is the best way to ensure my responsive form is centered and aligned properly with all other elements on the page

Link to website This final step is all that stands between me and the completion of my website deployment. However, I am faced with a persistent issue that has me stumped. It seems that there is an unexplained margin on the left side of the contact form, ...

htmlcssformsinternet-explorerresponsive-design

Managing collapsible content in Bootstrap 4: A comprehensive guide

How can I customize collapsible content in Bootstrap 4? For instance, take a look at this navbar: https://i.sstatic.net/UYbMQ.png https://i.sstatic.net/OuVdw.png https://i.sstatic.net/lXvYt.png I'm looking to modify the behavior of this example. ...

htmlcsstwitter-bootstraptwitter-bootstrap-4

The visual symbol is not being shown on the selection box in Mozilla Firefox

I've encountered an issue with a checkbox I created to display a + and - for expand and collapse functionality. HTML Code: <input type=checkbox class="ins" ng-model=show ng-class='{open:show}'><b>Show</b> CSS code: .ins ...

javascripthtmlcssangularjsfirefox

Can you choose the class that has not yet been seen before?

Imagine a scenario where the following code is present: <div class="a"> <div>1</div> <div>2</div> <div> <div> <div class="b">3</div> </div> ...

css

Is there a way to prevent EasyTabs from automatically selecting the second tab?

I'm facing an issue with setting the default tab using easytabs. Currently, the second option is automatically selected as the default tab. Previously, I had successfully set the first tab (statistics) as the active tab but lost the file. Now, I am s ...

htmlcss

Utilizing jQuery for displaying or hiding list elements

To view all the code, click on this link: http://jsfiddle.net/yrgK8/ A section titled "news" is included in the code snippet below: <ul id="news"> <li><p>asfdsadfdsafdsafdsafdsafdsafdsafdsa</p></li> <li>&l ...

javascriptjqueryhtmlcssslideshow

What is the process for generating an Electronic Program Guide for television?

Welcome to the forum! I'm a front-end developer at a company for 6 months now, currently working on a TV app. It's my first experience in this field and I'm facing some challenges, particularly with creating an epg for the app. Unfortunately ...

javascriptcssvue.jstelevisionepg

Introducing space between div elements changes the arrangement of columns

I am facing an issue with my layout consisting of 6 div tags divided into 2 rows of fixed height. Whenever I try to add a margin around the divs, the rightmost div gets pushed down to the next row. How can I solve this problem? HTML: <div class="contai ...

csstwitter-bootstrapbootstrap-4

Animating a dotted border path in SVG for a progress bar effect

I am attempting to create an animation for a dotted SVG circle that resembles a progress bar, where it fills itself over a duration of 3 seconds. However, I am facing difficulties in achieving this effect with the dotted border. The current code I have doe ...

javascriptjquerycssanimationsvg

How to pass data between components in Angular using @Input, @Output, and EventEmitter

After selecting a team from an array in one component, I am having trouble passing that selected team to another component. While I can log the selected team in the same component, I'm unable to access it in the other component. My goal is to use the ...

htmlcssangularbootstrap-4

How can I add information into a nested div element?

I encountered an issue when attempting to insert data into my block. The div structure is as follows: <div class="1"> <div class="2"> <div class="3"> <div class="4"></div> </div> ...

javascriptjqueryhtmlcss

Issue with customizing the appearance of the selected option in a dropdown menu

Is there a way to change the background color of each option in a select box when it is selected? Currently, when an option is clicked, it appears blue along with the selected text color. I have tried various selectors like :active, :focus, ::selection, [s ...

csscss-selectors