Jump to content

newcoder1010

Members
  • Content count

    377
  • Joined

  • Last visited

Community Reputation

3 Neutral

About newcoder1010

  • Rank
    Member

Recent Profile Visitors

20,070 profile views
  1. newcoder1010

    How to overwrite element.style

    Thanks.
  2. newcoder1010

    How to overwrite element.style

    Hello, Inspected my site in chrome. Selected this link: <form class="form-view theme7" id="agile-form" action="" style="max-width:450px;" method="GET"> I see this css: element.style {max-width:450px;} .form-view { font-family: Tahoma,Geneva,sans-serif; width: 100%; background: #fff; font-size: 14px; padding: 10px; } Now form shows 450px width. I would like the form to be 100% width. How to make the form 100% width?
  3. newcoder1010

    How to remove weird space of mobile menu bars

    Hello, I see a space to the right of mobile menu bars. I just cant fix it. How can I remove the space to the right of mobile menu? If you could see the link for an image, it might help you to understand my problem. <div data-mediasize="992" class="responsive-menus responsive-menus-0-1 absolute responsified"> <span class="toggler">☰ </span> <section id="rm-removed" class="responsive-menus-simple"> <ul class="rm-removed" id="rm-removed"> </ul> </section></div> .responsive-menus.responsified { margin-top: 130px; margin-right: 0; margin-left: 0; padding: 0; } .responsive-menus.responsified { clear: both; width: 100%; } https://drive.google.com/open?id=1CuZEdWwRkg1tAFR9HQTGZdali3RtYlYG Thanks.
  4. newcoder1010

    How to place the logo in the center of anchor

    Thanks.
  5. newcoder1010

    How to place the logo in the center of anchor

    Sorry did not see @dsonesuk post. I tried this and worked. .navbar .logo { margin-right: -15px; padding-left: 15px; padding-right: 15px; text-align: center; display: block; float: none !important; } Thanks.
  6. newcoder1010

    How to place the logo in the center of anchor

    I tried this but no luck. .navbar .logo { margin-right: -15px; padding-left: 15px; padding-right: 15px; text-align: center; } .pull-left { float: none !important; } Please advise.
  7. newcoder1010

    How to place the logo in the center of anchor

    Hello, HTML: <a class="logo navbar-btn pull-left" href="/" title="Home"> <img src="/sites/default/files/mmmo_0.jpg" alt="Home"> </a> My CSS .logo {text-align:center;} Currently, image is floated to left I guess because of bootstrap default pull-left class. When I click on a class in chrome inspect, I get this css: .navbar .logo { margin-right: -15px; padding-left: 15px; padding-right: 15px; } .pull-left { float: left !important; } I wont be able to change any html classes. How can I place the logo in the center of logo class? Thanks.
  8. newcoder1010

    How to overwrite list style

    Unfortunately I am not able to remove the classes and add a new class. How can I overwrite?
  9. newcoder1010

    How to overwrite list style

    Hello, HTML: <ul class="menu nav"> <li class="first leaf active-trail visited active"><a href="</a></li> <li class="leaf"><a href="</a></li> </ul> CSS from bootstrap cdn has this: .nav { list-style: none; } ul li.collapsed, ul li.expanded, ul li.leaf { list-style: none; } How to overwrite to display the bullets next to list item?
  10. newcoder1010

    How to edit my post

    Hello, How can I edit my old post? I do not see any edit option to edit an old post? Thanks.
  11. newcoder1010

    How to fix carousel slideshow padding issue

    Max height fixed it. I spent hours for that. Thanks.
  12. newcoder1010

    How to fix carousel slideshow padding issue

    Hello, I spent hours to fix it but no luck. I created slideshow using carousel. Original size of each image is 1500x650px. CSS to parent class and slideshow images. .front .carousel-inner { position: relative; width: 100%; overflow: hidden; height: 550px; } .front .view-sliders img { width: 100%; } When I visit the site in laptop, it looks ok. As I am making the screen smaller, I see padding between bottom of image and bottom of parent. I can fix the padding by giving height:100% instead of giving height:550px to parent. Problem with that is the image height in laptop looks big. When I get to mobile screen, I have this. I can kind of accept it as is. front .carousel-inner { height: 100%; } At his point, I am asking you to help me fixing it. You can provide any recommendations to make it responsive slideshows. I would like to keep the slideshow images height about 550px by cropping the images. This is my site. If you could visit my site and help me, I would really appreciate it. Thanks.
  13. newcoder1010

    How to style mobile menu

    Hi, I have this code to make the mobile menu (3 bars) to green. .responsive-menus.responsified span.toggler { padding: 0; display: block; color: green; border-radius: 0; background: #fff; box-shadow: 0px 0px 0px #000; font-size: 3.35em; text-align: center; /* cursor: pointer; */ margin: 0; outline: none; /* width: 100px; */ } When I view the page in desktop and then make screen mobile size, I see the mobile menu is green. When I visit the page in mobile phone, bar is kind of black. I am not sure why my phone does not show the color green. How to overwrite to make sure mobile menu bars are green? Thanks.
  14. newcoder1010

    How to style webform date picker?

    Hello, HTML: <div class="webform-container-inline webform-datepicker"> <div class="form-item form-item-submitted-personal-information-birth-date-month form-type-select form-group"> <select class="month form-control form-select" required="required" id="edit-submitted-personal-information-birth-date-month" name="submitted[personal_information][birth_date][month]"> <option value="" selected="selected">Month</option> <option value="1">Jan</option> <option value="2">Feb</option> </option> </select> <label class="control-label element-invisible" for="edit-submitted-personal-information-birth-date-month">Month</label> </div> <div class="form-item form-item-submitted-personal-information-birth-date-day form-type-select form-group"> <select class="day form-control form-select" required="required" id="edit-submitted-personal-information-birth-date-day" name="submitted[personal_information][birth_date][day]"> <option value="" selected="selected">Day</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> <label class="control-label element-invisible" for="edit-submitted-personal-information-birth-date-day">Day</label> </div> <div class="form-item form-item-submitted-personal-information-birth-date-year form-type-select form-group"> <select class="year form-control form-select" required="required" id="edit-submitted-personal-information-birth-date-year" name="submitted[personal_information][birth_date][year]"> <option value="" selected="selected">Year</option> <option value="1888">1888</option><option value="1889">1889</option><option value="1890">1890</option><option value="1891">1891</option> <option value="1892">1892</option><option value="1893">1893</option><option value="1894">1894</option><option value="1895">1895</option><option value="1896">1896</option><option value="1897">1897</option> </select> <label class="control-label element-invisible" for="edit-submitted-personal-information-birth-date-year">Year</label> </div> </div> Now Month, Day, Year display in a column. How can I display month, day and year in the same row? I tried this and I still see them in a column. select#edit-submitted-personal-information-birth-date-year { width: 33%; float: left; } select#edit-submitted-personal-information-birth-date-day { width: 33%; float: left; } select#edit-submitted-personal-information-birth-date-month { width: 33%; float: left; } Please advise.
  15. newcoder1010

    How to style slides in slideshow

    I tried so many codes. I made some progress. I applied css to delay the caption. Now I have 400px height to parent. How can I say display only middle portion of the images by cropping 15% top and bottom in all devices without leaving any padding in the parent element? Its ok if people head is cropped. My goal is to learn. After that I can play with that. .page-node-73 .container .carousel-inner { position: relative; width: 100%; overflow: hidden; height: 400px; } I am not able to give background image in html. Only option I have is to use css. This is the page where I am practicing incase if you like to see. Thanks.
×