Responsive Web Help

Can someone tell me why there is a large amount of padding on the dark horizontal nave here:
https://www.gopherstateevents.com/results/cc_rslts/rslts_by_split.asp?meet_id=600&race_id=2956

but not here:
https://www.gopherstateevents.com/results/cc_rslts/cc_rslts.asp?meet_id=600&show_indiv=n&hide_team=n&hide_ind=n&sport=Cross-Country

Thank you!

3 Comments

JavaScript Best Practices

LVL 19

Save hours in development time and avoid common mistakes by learning the best practices to use for JavaScript.

I am having difficulty with responsive web page on smart phones.
I cannot seem to get the left margin right.
I want the page to be left aligned and not have so much whitespace and the text/buttons to be smaller.
I also have the problem with Chrome retrieving a new page each time.
So, I did some research, and found that if I used the following line -

<meta name="viewport" content="width=device-width, initial-scale=1">

Open in new window

it should clear the problem up with Chrome. But it is not working for me.
I have two css pages - and I was using just the following coding in my html pages:

<link rel = "stylesheet" type = "text/css" href = "../rainbowservicedogs/css/rwdgeneral.css" />
<link rel = "stylesheet" type = "text/css" href = "../rainbowservicedogs/css/rwdcss.css" media="screen and (max-width:500px)">

Open in new window

I have attached the css files and the main page...
the web site link is: www.htpp://mjsayers.com/index.html
Thank you in advance for any help and suggestions.
index.html
rwdcss.css
rwdgeneral.css

4 Comments

I'm currently developing a new WordPress site for a client using the Bootstrap 4-based Understrap theme development framework, and am running in to some difficulty translating the custom design that I was provided with into a responsive WordPress theme. Here is a link to the site .. still a work in progress, obviously:

http://dev.movingpicture.com/

(I've been focusing exclusively on the header and footer, you'll notice).

I've made some significant progress, meaning that I've got the desktop layouts pretty well figured out and displaying nicely (ie: 1920px, 1366px, 1280px, etc.). I just need some advice on how best to handle the mobile layout, .. meaning the tablet and phone-based viewports (ie: 992px, and 576px), You see, the designer provided me with comps for the mobile layout significantly later than anticipated, .. sort of like an afterthought, and without much understanding of the way Bootstrap works.

Here are some images depicting what's expected for the mobile layout:

Mobile Header - Navigation menu collapsed

Mobile Header - Navigation menu expanded

You'll notice 2 significant things that are particularly problematic:

1) The hamburger icon for toggling the mobile navigation menu and the search box have been swapped

2) The expanded mobile navigation menu is being displayed under the search box - instead of directly underneath the hamburger icon (the latter of which is the standard, default behavior)

So my questions are ..

1) Is there any clever kind of way that I…

5 Comments

Here is the page in progress:
https://www.stadriemblems.com/enamel-pins-gallery/

You'll see that on the very top of the page, I have two banner images that look pretty similar. I only want to use one of them, of course, but here is my predicament:

1) The first one is called up as a div class I created called "top-photo" with the image as a background image. This is ultimately what I want because I want to overlay text.
2) The second image is simply an img tag with the built in Bootstrap class of "img-responsive"

Here is what I am trying to accomplish:

1) I want the image to be called up like the first one, as a background image, so that I can overlay text.
2) But I want it to resize for smaller screens the way the second image is doing. It is resizing nicely (the height changes and the image fits the screen) because it has the "img-responsive" class applied to it. The first image isn't really resizing; it's just getting cut off.

Is there some way to apply the "img-responsive" properties to a background image?

I hope that makes sense, and thanks!

11 Comments

I have a web application that uses Bootstrap and I'm trying to make it more mobile responsive.
There is an HTML page that I'm working on now that uses a list groups. That top list row has the labels of agree, disagree, etc, and the following list rows each have a question with some input radio buttons.
When the page is seen in a large screen, the radio buttons are aligned properly with the labels. When the screen becomes small, however, the radio buttons stack beneath the question. So, I added a class="hidden-lg" on a span with a number for each radio button so that when the page is smaller, people can see the radio buttons numbered. They don't need to be numbered when the page is large. However, I can't get the number to appear to the left of each radio button. The numbers keep appearing above the radio buttons. How do I get the span tag with the number to appear to the left of the radio button?
Here are some examples of what I've tried so far.
This example causes the radio buttons to appear under the question in a vertical column with the number above the radio button:

<li class="list-group-item">
    <div class="row">
        <div class="col-lg-8">
            <strong>7.</strong> Course assignments are relevant to the course.
        </div>
        <div style="display:block" class="col-lg-1 align">
            <span class="hidden-lg">1</span>
            <input  type='radio' name='q27' value="1" />
        </div>
        <div class="col-lg-1 align">

Open in new window

…

16 Comments

Our company's website is very outdated... it was designed in 2007 when the importance of a responsive design was not as prevalent. However, I did load it with SEO and surprisingly it still generates leads for us. Because our business is not IT related, I do not want to take the time to rebuild the site myself with a custom responsive design. My thought was to move to WordPress as long as I have complete control over the SEO. From my research, my thought was to use WPSEO WP theme with Yoast. My question is does anyone have experience with this combination and does it give you the full control (titling links, etc.) that I want.

4 Comments

Need to display a few dozen photos / cross-platform

What quick to code cross-platform solution is there to enable people in my tour to follow along with their smart phones? I have about 25 images which I want to provide them and make it easy to jump to Image #14, for example.

I want to start simple and give them just a Next and Previous button and a Jump To option.

I understand I could write this as a responsive web page, but would need a back-end service and a database of images. But I want a canned solution I can configure and get up and run with.

I hope for a generic platform which is well enough known that I could hire an outside developer to code for me in about 15-20 hours of work.

What can you suggest?

Thanks

4 Comments

Which on is the best tool for mobile web applications/apps (Python or Java or asp.net)

3 Comments

I had someone design the website and I needed to fix some issues, I don't much of wordpress design and I wanted to disable google maps from my website, I found where to disable it and I just noticed that my other pictures on all pages aren't loading and missing. How could I go back or check if some else made changes? and how to fix this issue

As you can see on this picture there should be more pictures but aren't there.

Please advise

4 Comments

Hi Experts,

I had created a web page. For the webpage to be responsive, I had included media queries. The page is okay in desktop but not in mobile views and tablet views.
Usually, I have to scroll horizontally to see the complete page in mobile and tablets view. I think scrolling horizontally on mobile and tablet views are not correct. I had seen sample responsive pages where the scrolling happens only vertically, we need not scroll horizontally for mobile and tablet pages. I had attached the web page code as zip as well as pasted code for the html and css file.

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <title>Ez proxy</title>
  </head>
  <body> 
    <div class="container-fluid">
	<div>
	<div id="mybanner">	   
	</div>  
	<div id="box" class="row" style="Text-Align:center">		
	<div class="card border-success col-xs-11 col-sm-11 col-md-5 col-lg-3" style="width: 15rem;">
	   <p><span><strong>Access these resources at Northern Territory Library<br>No Login

Open in new window

…

6 Comments

Build an E-Commerce Site with Angular 5

LVL 19

Learn how to build an E-Commerce site with Angular 5, a JavaScript framework used by developers to build web, desktop, and mobile applications.

LVL 1

Question by

coder

2018-04-23Solved

height issue with containers div

Hi Experts,

I have a parent div with class container with min-height 100% and having a border. I have child div's But on mobile view parent container border is not growing with the size of child elements. Child div's comes out of parent div. Please see the screen and code below for more information. You can see the third card is outside the main container. Please help me in resolving this issue

  <body> 
    <div class="container">
    <div class="jumbotron">
        <img  src="images\banner.png"/>
    </div>
	<div class="row" style="Text-Align:center">
	
	<div class="card border-dark" style="width: 15rem;">
	   <p><h5><strong>Resources available to access at Northern Territory Library Only</strong></h5></p>
	   <ul>
	         <li><a href="https://ntln.idm.oclc.org/login?=url=https://ancestrylibrary.proquest.com"><strong>Ancestry Library Edition</strong></a></li>
			 <li><a href="https://ntln.idm.oclc.org/login?url=https://www.findmypast.com.au"><strong>find my past Australiasia</strong></a></li>
			 <li><a href="https://ntln.idm.oclc.org/login?url=https://www.saiglobal.com/online/autologin.asp?br=true&userid=6500121359"><strong>SAI Global onsite</strong></a></li>
			 <li><a href="https://ntln.idm.oclc.org/login?url=https://www.pressreader.com"><strong>Press reader</strong></a></li>
	   </ul>	   
	</div>
	<div class="card border-dark" style="width: 15rem;">
	   <p><h5><strong>Login to these resources anywhere using your public library

Open in new window

…

3 Comments

I have a jsp page using struts tag as below:

<html:form action="/actions/graphics/job/attachFile/confirm">
<html:cancel value="Cancel" styleClass="buttons"></html:cancel>
<html:submit value="Confirm"/>
</html:form>

Open in new window

public ActionForward execute(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) throws Exception
	{
		ActionForward actionForward = SessionChecking.checkUserBean(mapping, request);
		if (actionForward != null)
			return actionForward;

		if (isCancelled(request))
		{
                 //do something here
                }
               //......
     }//execute

Open in new window

it works very well in production for years, now I am trying to change the looking of the button by integrating with bootstrap.
When I only changed the looking of button confirm, it looks like this:

at this moment, both buttons are functioning.

however, when I tried to change the looking of both buttons, it looks like this:

             <html:form action="/actions/graphics/job/attachFile/confirm">
		<button type="submit" id="cancel" name="cancel" class="btn btn-default" value="Cancel"  > Cancel</button>
		<button type = "submit" id="submit" class ="btn btn-primary" value="Confirm"> Confirm</button>
		</html:form>

Open in new window

they both looks good, but the problem is both buttons are doing the same job, which means they both have the CONFIRM function , no more CANCEL function.

then I tried a little modification for experiment:

             <html:form action="/actions/graphics/job/attachFile/confirm">
		<button type="button" id="cancel" name="cancel" class="btn btn-default" value="Cancel"  > Cancel</button>
		<button type = "submit" id="submit" class ="btn btn-primary" value="Confirm"> Confirm</button>
		</html:form>

Open in new window

the problem for this code is the CANCEL button does NOT work at all regardless how many time I click on it.

can anybody help me on this? all I want is just make the CANCEL button looks as big as the CONFIRM button but keep the original functioning.
I think the real question would be : how to transfer the value of CANCEL button to the HttpServletRequest such that the function isCancelled(request) can return true?
by name="cancel" ? value="Cancel" ? or type="cancel"?

11 Comments

Hello, I have an older contact form that was written using html table elements that I'm looking to re-code using CSS (specifically with the grid elements) so that it is responsive and mobile friendly. Could someone help me out with the basic CSS / HTML frame work to accomplish the following? I'd like the layout to be two columns in a larger display and one column in a mobile/smaller display, as follows:

Larger Display:
Field1 label Field1 input Field2 label Field2 input
Field3 label Field3 input Field4 label Field4 input
Field5 lable Field5 input Field6 label Field6 input

Submit (centered)

Medium Display:
Field1 label Field2 label
Field1 input Field2 input
Field3 label Field4 label
Field3 input Field4 input
Field5 label Field6 label
Field5 input Field6 input

Submit (centered)

Small/Mobile Display
Field1 label Field1 input
Field2 label Field2 input
Field3 label Field3 input
Field4 label Field4 input
Field5 label Field5 input
Field6 label Field6 input

Submit (centered)

9 Comments

LVL 7

Question by

weikelbob

2018-01-22SolvedPrivate

simple responsive CSS/HTML - centering an image on mobile

Hello,

For some reason, my ask-a-nurse image on mobile is not centered. It's the nurse image at the top of the page.

The buttons under it are centered on mobile, but the nurse picture isn't. Could you tell me how to center it and keep everything else the same on all devices?

www.idiaper.com

<div id="iconDiv-nurse" style="text-align:center">
<a id="nurseImg" href="http://www.idiaper.com/Ask-A-Nurse_ep_29.html"><img id="left-nurse1" alt="ask a nurse button" src="http://www.idiaper.com/assets/images/left-nurse2.jpg"></a><div id="nurseLinks">
  <a href="http://www.idiaper.com/womens-diapers"><img alt="for women button" src="http://www.idiaper.com/assets/images/women-nurse2.jpg"></a><a 
  href="http://www.idiaper.com/Auto-Reorder_ep_43-1.html"><img alt="auto-reorder button button" src="http://www.idiaper.com/assets/images/auto-ship-nurse3.jpg"></a><a 
  href="http://www.idiaper.com/mens-diapers"><img alt="for men button" src="http://www.idiaper.com/assets/images/men-nurse.jpg"></a><a 
  href="http://www.idiaper.com/overnight-adult-diapers"><img alt="overnight products button" src="http://www.idiaper.com/assets/images/overnight-nurse2.jpg"></a><a 
  href="http://www.idiaper.com/adult-pullups"><img alt="pull ups button" src="http://www.idiaper.com/assets/images/pull-ups-nurse2.jpg"></a><a 
  href="http://www.idiaper.com/adult-cloth-diapers-briefs"><img alt="adult cloth diapers button" src="http://www.idiaper.com/assets/images/acd-nurse2.jpg"></a>

</div> 
</div>

Open in new window

#nurse-cat
{
float:left;
background-color:#3690cf;
color:#fff;
font-weight:normal;
padding:1%;
padding-right:2%;
}

#nurse-cat a,#nurse-cat a:hover, #nurse-cat a:visited
{
text-decoration:underline;
}

#nurse-cat a:hover
{
color:#9fa2a3;
}
#nurse-cat a:visited
{
color:#46c4ff;
}

#nurse-cat img
{
float:left;
margin-right:10px;
}


@media screen and (max-width: 600px){

#nurse-cat img
{
width:135px;
}

}

Open in new window

3 Comments

Please help with my JQuery click logic.
currently I can only hide the mobile menu when I click the menu button. I want it to hide when we click on any menu item or anywhere outside the menu as well. What I cannot figure out is how to hide the main menu in mobile mode but not desktop mode and not breaking the sub-menu function.
Code below is in 3 parts first JQuery, then CSS then HTML

(function($) { // Begin jQuery
  $(function() { // DOM ready
    // If a link has a dropdown, add sub menu toggle.
    $('nav ul li a:not(:only-child)').click(function(e) {
      $(this).siblings('.nav-dropdown').toggle();
      // Close one dropdown when selecting another
      $('.nav-dropdown').not($(this).siblings()).hide();
      e.stopPropagation();
    });
    // Clicking away from dropdown will remove the dropdown class
    $('html').click(function() {
      $('.nav-dropdown').hide();
    });
    // Toggle open and close nav styles on click
    $('#nav-toggle').click(function() {
      $('nav ul').slideToggle();
    });
    // Hamburger to X toggle
    $('#nav-toggle').on('click', function() {
      this.classList.toggle('active');
    });
  }); // end DOM ready
})(jQuery);
body {
  margin: 0;
}

nav {
  float: right;
}

nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

nav ul li {
  float: left;
  position: relative;
}

nav ul li a {
  display: block;
  padding: 0 20px;
  line-height: 70px;
  background: #262626;
  color: #ffffff;
  text-decoration: none;
}

nav ul li

Open in new window

…

5 Comments

Trying to get this to look good on all devices. Please help.

Page: http://www.idiaper.com/depends-diapers

It's just the top blue box with the ask-a-nurse image in it. It looks bad when I resize the screen and also on tablet and mobile.

Need the font to be big all the time. We are dealing with older people:

Sometimes text-align:center has to be inline with our cart, btw.

Looking for html and css to copy and paste in, and if you want to explain your code so I can learn that would be great.

<div id="category11">
	<div id="ask-a-nurse-cat">
	<a href="http://www.idiaper.com/Ask-A-Nurse_ep_29.html"><img class="responsive-left" 				    	src="/assets/images/ask-a-nurse-cat2.gif">
	</a>
	</div>
	<div id="cat-top-right">
	  <h1 style="font-size:120%">Depends Diapers for Adults at iDiaper.com </h1>
	Below are Depends Diapers for men and women. There's some unique items in these 				categories like the Depend Adjustable Underwear (heavy) that's a pull up but it has tabs 	on the side for adjustment as well. 
	</div>
</div>

Open in new window

#category11
{background-color:#3690cf;
padding:5px 5px;
}

#category11 h1
{
color:#fff;
font-size:20px;
}

#category11 p
{
color:#fff;
}

#category11 p a, #category11 p a.visited
{
color:#0d3d5f;
text-decoration:underline;
}

#ask-a-nurse-cat
{
display: inline-block;
width:18.289%;
height:auto;
}
#ask-a-nurse-cat img
{
display: inline-block;
width:100%;
height:auto;
}
#cat-top-right
{
width:81.7%
height:auto;
text-align:left;
display: inline-block;
vertical-align:top;
padding-left:2%;
}


@media screen and (max-width: 600px){
#ask-a-nurse-cat
{
display:block;
max-width:171px;
padding-right:10px;
padding-bottom:10px;
}


#category11
{
font-weight:normal;
}

Open in new window

5 Comments

LVL 7

Question by

weikelbob

2018-01-08Solved

responsive css/html float left and mobile

Hello,

How do I get the buttons that are under the ask-a-nurse button on the attached screenshot (broken.png) to float left next to the nurse? Looking for 6 buttons to the right of the nurse.

Also, make sure it looks good on mobile.

Looking for html & css

<div id="nurseLinks">
<a href="http://www.idiaper.com/Ask-A-Nurse_ep_29.html"><img id="left-nurse1" alt="ask a nurse button" src="/assets/images/left-nurse2.jpg"></a>
<div id="iconDiv-nurse">
  <a href="http://www.idiaper.com/womens-diapers"><img alt="for women button" src="http://www.idiaper.com/assets/images/women-nurse2.jpg"></a><a 
  href="http://www.idiaper.com/Auto-Reorder_ep_43-1.html"><img alt="auto-reorder button button" src="http://www.idiaper.com/assets/images/auto-ship-nurse3.jpg"></a><a 
  href="http://www.idiaper.com/mens-diapers"><img alt="for men button" src="http://www.idiaper.com/assets/images/men-nurse.jpg"></a><a 
  href="http://www.idiaper.com/overnight-adult-diapers"><img alt="overnight products button" src="http://www.idiaper.com/assets/images/overnight-nurse2.jpg"></a><a 
  href="http://www.idiaper.com/adult-pullups"><img alt="pull ups button" src="http://www.idiaper.com/assets/images/pull-ups-nurse2.jpg"></a><a 
  href="http://www.idiaper.com/adult-cloth-diapers-briefs"><img alt="adult cloth diapers button" src="http://www.idiaper.com/assets/images/acd-nurse2.jpg"></a>
</div>
</div>

Open in new window

#imgLinks-nurse {
text-align:center;
background-color:#3babdd;
}

#iconDiv-nurse {
padding-top: 0.8em;
float:left;
background-color:#59c8fd;
}

#left-nurse1
{
float:left;
width:29.2674%;
}

#iconDiv-nurse img{
width:23.2086%;
border:0;
margin-top:-5px;
flaot:left;
}

#iconDiv-nurse a{
border:0;
margin:0;
vertical-align:center;
}


@media screen and (max-width: 600px){
   #iconDiv-nurse img {width: 50.33%;}
   #leftnurse1 img {width: 100%;}
}

Open in new window

broken.png

12 Comments

Hello,

page: www.idiaper.com

I am serving something different to under 600px. Everything is working right now but the code is very bloated with a lot of unnecessary items. I'm going to first attach the code that is working that I'm using, then attach some code that Slick812 gave me that is a partial solution to the bloated code that you can use to complete the clean code. Hoping Slick812 can step in, anyone else is free to help.

Thanks.

My CSS and html:

#smallhomemenu
{
height:0px;
overflow:auto;
}

#home-menu
{
background:#3babdd;
max-width:100%;
height:auto;
}

#home-menu, #home-menu .top,#home-menu .bottom
{
max-width:100%;
height:auto;
}

#home-menu, #home-menu .top,#home-menu .bottom,#home-menu .top-4-guides,#home-menu .8-minute-video,#home-menu .faq,#home-menu .glossary, #home-menu .best-6-adult-diapers
{
float:left;
padding:0px;
margin:0px;
background:transparent;
}

#home-menu .top-4-guides,#home-menu .8-minute-video,#home-menu .faq,#home-menu .glossary, #home-menu .best-6-adult-diapers
{
max-height:155px;
max-width:133px;
overflow:hidden;
background-transparent;
}

#home-menu .top
{
margin-bottom:0px;
max-width:100%;
}

.bottom
{
margin-top:-5px;
max-width:100%;
background-color:#3babdd;
}

.holder-buttons-home
{
max-width:100%;
height:auto;
}

.holder-buttons-home div {
	width: 16.666666%;
	height:auto;
	background-color:#3babdd;
}

.holder-buttons-home div img {
	width:100%;
	max-height:133px;
}


@media screen and (max-width: 600px) {

Open in new window

…

6 Comments

I am using a new wordpress template called Smartline Lite by ThemeZee for this site:
http://plymouthpubliclibrary.net/

Does anyone know how to modify so that the brackets that appear on posts on the home page have more than [...]

I would like it to say something like [ read more] I checked everyone and could not find how to modify this setting.
Here is a screenshot:

https://screencast.com/t/Qa7HfFZVW

10 Comments

Announcing the Winners!

LVL 19

The results are in for the 15th Annual Expert Awards! Congratulations to the winners, and thank you to everyone who participated in the nominations. We are so grateful for the valuable contributions experts make on a daily basis. Click to read more about this year’s recipients!

Hello,

Can you tell me the code adjustments (both html and css) to get this:

www.idiaper.com (top row of buttons and blue box)
Note that it's an online store service so sometimes you have to hard-code text-align:center

1. Looking good on all devices
2. With the circles centered at all browser widths (right now they go to the left)
3. blue background on all devices and browser widths
4. anything else that needs adjustment.

Thanks.

<div id="home-menu" style="text-align:center;background-color:#3babdd;">
<div class="holder-buttons-home" style="text-align:center">
	<div class="top" style="float:left">
	<img alt="top of menu that says, relax, breath, you've come to the right place, clickable menu below" src="/assets/images/top.gif">
	</div>
			<br>
		<div class="top-4-guides" style="float:left">
		<a href="#top-4-guides"><img alt="top 4 guides button" src="/assets/images/top-4-guides.gif"></a>
		</div>
		<div class="shop-by-category" style="float:left">
		<a href="#shop-categories"><img alt="shop-by-category button" src="/assets/images/shop-by-category.gif"></a>
		</div>
		
		<div class="8-minute-video" style="float:left">
		<a href="#8-minute-video"><img alt="8-minute-video button" src="/assets/images/8-minute-video.gif"></a>
		</div>
		
		<div class="best-6-adult-diapers" style="float:left">
		<a href="#best-6"><img alt="best-6-adult-diapers button" src="/assets/images/best-6-adult-diapers.gif"></a>
		</div>
		
		<div class="faq" style="float:left">
		<a

Open in new window

…

10 Comments

Just pushed site live. Noticed that the company logo in upper left "vibrates or flashes" when you mouse over it. Not sure why that is. Any idea how to correct?

http://endriesexpressinc.com

3 Comments

Hello

We would like to know if it is possible to modify our website which has been developed in ASP so that it becomes responsive, but especially by keeping the headers and footers in a fixed position.

Here is the original version of our website (not responsive) : http://www.ex0-sys.ch/

We have a test version of our site that is responsive, but we do not master the technique to maintain our original design.

Here the test version being modified (responsive) : http://94.103.101.201/Ex0.Web.Staging/

What technologies should we use because it seems to be a major problem for everyone?

Thank you in advance for your answers.

Regards,

RL

5 Comments

On a tablet, IN BLACK FOOTER by the bottom navigation, the phone number appears. It isn't supposed to show up there. It isn't in the widget. It does not show up on desktop. Wondering how/why it is there since the footer bottom navigation is displayed by going to appearances/menus. I do not have anything that calls for a phone number.

17 Comments

Why is there a DOUBLE underline on phone number at bottom of page?

See screenshot
https://screencast.com/t/Jf41U7LUxR

live site:
https://screencast.com/t/Jf41U7LUxR

5 Comments

LVL 3

Question by

E-Dub

2017-12-12Solved

Z-Index Issue

Hoping someone can help me with a CSS fix. I have a dropdown that displays behind the body content (see attached).

If you enter "9" in the second input field, you'll see a dropdown of suggestions, but that dropdown is displaying behind the content underneath it. I've tried changing the z-index but it isn't working. Any help would be appreciated.

Here's the link to view: http://173.230.154.241/services

4 Comments

Responsive Web

Related Topics

Responsive Web

Related Topics