How to make div inside table same size as text inside a?
use display: inline-block; for .block table.table-1 { width: 100%; } .block{ display: inline-block; } <table class="table-1"> <tr> <td align="center"> <div class="block" id="block-1" style="background: black"> <a style="color: #fff" href="myFunc()">text text text</a> </div> </td> </tr> </table> ...
Input button image disappears on submit
Try to add active state's style also this also: .search-button:active {...} @Solution Updates: Adding :default state fix issue....
Need help styling on javascript
Sorry, this post is a bit too length for the comment box. \n is the universal newline character. But perhaps you should look at this alternative: var stateData = { MA: { fullName: 'Massachusetts', motto: 'A catchy expression here', information: 'More data here', population: 1000 }, } To me it...
html styling to css styling converter broke my background menu
Your CSS is overriding the form script running when users select the color. I'm guessing it was added when the code validator generated CSS based on the page code you submitted. Just remove the background-color property from the body tag in the CSS file (line 13 in the HTML) and...
How to make glassy button with drawable on top?
Here is the view for your requirement <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:drawableTop="@drawable/android" android:text="Android" android:padding="20dp" android:gravity="center" android:layout_gravity="center" android:drawablePadding="15dp"/> I have tried this with 75 * 75 dp drawable. It is aligning to the center. You can also set background to the button for glassy look. To do it so use this tool...
changing the styling of a parent and parent's parent of an active element, using fullPage.js callback
jquery,parent,styling,fullpage.js
To quickly answer your question I will first provide solution. Although this is not best practice, and not helping you learn the right approach to design html structure and traverse the DOM in efficient and quick way, it will solve this specific problem. If it was all designed better, this...
Horizontal Line Styling on Each Side of Titles
use :before or :after Example 1: h2{ padding: 0 20px; text-align: center; } h2:before, h2:after{ content: ''; width: 150px; height: 1px; margin: 0 10px; background: #ccc; display: inline-block; vertical-align: middle; } <h2>title</h2> <h2>title title title</h2> Example 2 div{ text-align: center; } h2 { padding: 0 20px; position: relative; text-align: center;...
Getting background color to fill the entire element
by default, most HTML elements have some margin applied. you can remove these from all elements in your CSS with the following line, best placed at the very top. *{margin:0;} just be aware this will apply to any paragraphs (or anything else) you add later, it might be better to...
How to Get Rid of the Shadow on Buttons?
javascript,html,button,styling
Setting border: 0 removes any shadowy effect on chrome at least
Is it possible to wrap looping PHP output in tags?
By doing your $t = "SELECT trackname FROM tracks WHERE albumID = #"; and if($row['albumID']==#) you are essentially still hardcoding similar to your friend. Just do 1 query, where you join all the tracks. Then when looping, group by the albumname - <?php require('mysqli_connect.php'); // SQL query $q = "SELECT...
CSS Styling (Text, and paragraph backgrounds) [Solved]
If I understand it rightly, you want to have slightly darker background for some paragraphs. You can include opacity into the background using rgba function: body{ background:#00FFFF; font-family:arial; } p{ background:rgba(0,0,0,0.2); color:white} <p> my text </p> ...
How can I get the current state of my div animation?
Do you need keyframes? You could achieve the same result using transitions, like in this fiddle. #menubar { /* Menu bar styling */ width: 75px; transition: width 2s; } #menubar:hover { width: 100%; } Basically, you tell that the menubar should be at 100% when hovered, at 75px when idle,...
HR with two colors
html,css,css3,stylesheet,styling
Use CSS with 2 borders like so: hr { border-top: 1px solid gray; border-bottom: 1px solid white; } Example in JSFiddle. And to mimic what you have in your picture with text floating on top of the HR, you can do something like this JSFiddle....
Google Map not displaying after applying custom style
The simplest way to do it is to just apply the styles to the map: var myOptions = { zoom: 3, minZoom: 3, center: map_center, styles: style_map, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("trackingT-map"), myOptions); proof of concept fiddle (unless you really want to have another map type) code snippet:...
CSS highlight links with custom border
Yes. Add padding and then fiddle around with the border radius until it meets your expectations: #navLink:focus{ padding: 10px /*here*/ border-radius: 30px; } ...
input type = 'submit' styling doesn't appear in IE 7
html,css,internet-explorer,styling
You can use it by make it as a class .btn { background:url('../images/btn_login.png')repeat-x; color:white; font-size:15px; border-radius:5px; } and then call it you html code <input type='submit' value='Masuk' class='btn'> ...
Setting AlternatingRowBackground for DataGrid with Templated DataGridRow
The gray rectangle is the so called row Header. By default the DataGrid turns on row and column header. You turn it off the row header by setting HeadersVisibility=Column So, you don't need a template to get that done....
Change SVG styling while hovering over non-sibling div
You can set an id to the element you want to change then you can also give it a "onmouseover()"-method which can change the color or other values as follows: var test = document.getElementById("YOUR_ID"); test.setAttribute("style", "fill:#EBC20E;"); ...
Check if container has Element
javascript,jquery,html,styling
You could use .filter and .children to select all .elementWrap objects which have a direct .form_required child - then find the labels within that subset: $(".elementWrap").filter(function() { return $(this).children(".form_required").length; }).find("label").css({'width':'auto','margin':'0px'}); jsFiddle There is almost always a way to avoid having to use .each and a lot of if statements....
LESS formatting
You can solve this by using the extend function in LESS. button, .button { // styles } input { &[type="submit"], &[type="reset"], &[type="button"] { // All styles from .button will also be available here. &:extend(.button); } } ...
Error using nth-child
close the achor tag HTML <a href="www.google.com">Google</a> <a href="www.google.com">Google</a> <a href="www.google.com">Google</a> http://jsfiddle.net/vasanthanvas/z569bm6w/...
Detect if a key should be treated as a style or attribute
var applyStyling = function (element, object) { return _.each(object, function (value, key) { // determine whether the key should be treated as an attribute or style if(element.hasAttribute(key)) element.setAttribute(key, value) else if (element.style.hasOwnProperty(key)) element.style[key] = value }) } Edit: modified answer based on OP comment var applyStyling = function (element, object)...
JavaFX8 ChoiceBox transparent?
Website for this kind of information on css in jfx: CSS Reference Guide Here is how you can manipulate the nodes inside of a coice box: .choice-box > .open-button > .arrow{ /* Example: -fx-opacity: 0; */ } You basically just need to step through all nodes that are inside...
Styling radio button label inside just one table row
javascript,jquery,radio-button,label,styling
$('input:radio').change(function() { // remove color properly on other radio buttons $(this).parents('tr').find('td label i').removeClass("on"); // add class for current label if ($('input:radio').is(":checked")) { $(this).parent().find('label i').addClass("on"); } }); Demo: http://jsfiddle.net/cos33qvk/2/...
How to style Android's AppBar action text?
It appears that actionButtonStyle and actionMenuTextAppearance should be used without android: namespace. As it can be seen in values-v21/values.xml of support library, Lollipop uses attribute from system theme (note the android: prefix), that's why my attempts worked with it: <style name="Base.V21.Theme.AppCompat.Light" parent="Base.V7.Theme.AppCompat.Light"> ... <item name="actionButtonStyle">?android:attr/actionButtonStyle</item> ... </style> ...
Enumerate and apply WPF styles programmatically
c#,wpf,xaml,storyboard,styling
Finally worked it out. The code I was looking for was as simple as VisualStateManager.GoToState(HelloWorldButton, "MouseOver", true); ...
How do I get the Onmouseover method to apply universally to all links?
class,styling,highlighting,onmouseover
1. You can try this: var links = document.getElementsByTagName('a'); for (var i = 0; i < links.length; ++i) { links[i].onmouseenter = function() {links[i].style.color = '#e3FF85';}; links[i].onmouseout= function() {links[i]..style.color = '#0000ff';}; } You get the list of all links using getElementsByTagName('a') ('a' is tag name for links), and you can do...
Why is my z-index not working in this code?
Your sidebar is not hidden because your .page-content doesn't have a background. Put a background and add this CSS: .page-content{ background: #fff; height: 100%; width: 100%; } This way, you'll be able to slide it to then side afterward....
How to margin div inside other div?
If i understand your question well i suggest you to change padding:10px; to padding-top:10px; and increase width of <div class='login'> element EDIT Your image change almost everything , please check this fiddle : SOLUTION Only thing i change is remove margin-top:15%; and replace it with padding-top:15%; so i can add...
HTML Word Wrap is not working properly?
It turns out that using word-wrap: break-word as a stand alone in a css file to get text to wrap in a tag will not work. The correct solution is to use a combination of max-width: XXpx stacked with word-wrap: break-word. This solution covers every browser I've tested it in....
How do I apply styling to sorted columns in Angular ui-grid?
angularjs,sorting,styling,angular-ui-grid
You can use the 'headerCellClass' option in your 'columnDefs'. Documentation is here : http://ui-grid.info/docs/#/tutorial/115_headerCellClass In your case it would be like : $scope.gridOptions = { enableSorting: true, columnDefs: [ { field: 'company', headerCellClass: function(grid, row, col, rowRenderIndex, colRenderIndex) { if (col.sort.direction) { return 'red'; } } } ], onRegisterApi: function(...
Android action bar icons: core_discard vs core_remove
ic_action_remove.png used to clear text in EditText and ic_action_discard.png used to remove some / all item from our Collection...
HTML TextBox permanent text behind number
Wrap your input in a div, add your unit as a sub element to that div and position it above the textbox. JSBIN: http://jsbin.com/mayurexoyi/1/edit?html,css,output HTML <div class="input_wrapper"> <input type="text" value="20" /> <div class="unit">KG</div> </div> CSS input { font-size:14px; padding:10px 25px 10px 10px; border:1px solid #CCC; } .input_wrapper { float:left; position:relative;...
Data Layer: Dynamic Styling
One option (toggles the styles in the google example you reference when the features are clicked): changed this function: // When the user clicks, set 'isColorful', changing the color of the letters. map.data.addListener('click', function(event) { event.feature.setProperty('isColorful', true); }); to: // When the user clicks, set 'isColorful', changing the color of...
How can I control my styling in another styling?
There are a few specific cases where you can change the styling of 1 element based on the state of another. Case 1: <h1> is a descendant of #menu #menu:hover h1 { color:#f00; } <div id="menu"> <h1>Headline</h1> <p>Just a paragraph to prove a point</p> <div> <h1>Another Headline that behaves exactly...
Width of the expander header affects the scrollviewer outside
What you are trying to do won't work because the width of the expander's header also includes the button used to expand and collapse the control. Think of it this way: the header area of the control contains two elements side-by-side, the expand/collapse button and the header "content". You are...
Can anyone help styling a view in drupal?
css,drupal,views,slideshow,styling
This is a old link, but I'm sure that it's useful for you: http://www.group42.ca/theming_views_2_the_basics Basically you have to create new files and put it in your theme. The name of your files depends on the view. And the module recomends names. On the other hand, you can add the border...
Set CSS style on all but specific page ID
DEMO You cannot choose selectors that are above the selection where you apply :not() An alternative is to first mention parent selection where your page id is applied then target the inner div's - Check the demo. CSS: section:not(.page-id-174) .et_section_regular, section:not(.page-id-174) #main-content{ background-color: #F5EFE5 !important } Note i am using...
How to set font attributes for all text in a chart?
json,coldfusion,styling,zingchart
You can use CSS descendant selectors to do this. Use your chart div's id and the tspan element selector to apply font-family, font-weight, font-size, etc..., to all of the text elements in a chart. Example for a chart render at div id="zc": <style> #zc tspan { font-family: Comic Sans, Comic...
Hovering Dialogue Box
Well, you can have, as Gene said, a label that's normally empty near the text field, but you can have it coloured like the background colour. This will make the user not able to see it, and when you detect something wrong, you can change the colour and add the...
Android Spinner, selector icon location
Option 1: <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" > <Spinner android:id="@+id/spinner1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:layout_marginLeft="48dp" android:layout_marginRight="48dp" /> </RelativeLayout> Option 2: <LinearLayout...
Wordpress: track down and remove pseudo element from wp_head [closed]
php,css,wordpress,header,styling
In your stylesheet, you have: @media screen and (min-width: 59.6875em) body:before { ... } This body:before pseudo-element is what is creating that "div" on the left hand side of the screen. Note The psuedo element properties begin on line 3893 of style.css?ver=4.1.1....
How to style a tag for current div with css?
This will style only the a elements with class close (that are a descendant of #dialog), which is what you want: unique control over your close text, not all your link text #dialog a.close { /*insert css here*/ } #dialog a.close:hover { /*insert cool hover css here*/ } ...
How to center two square blocks in page?
You can use flexbox. support HTML <div id="container"> <div class="status"></div> <div class="status"></div> </div> CSS #container { width: 800px; height: 600px; margin: 0 auto; border: 1px solid #ccc; display: flex; align-items: center; justify-content: center; } .status { height: 100px; width: 100px; background: #efefef; margin-left: 2px; border: 1px solid #ccc; } http://jsfiddle.net/b9n3h1en/...
How to style each list item background of the wordpress navigation seperately
wordpress,navigation,styling,nav
It sounds like you want different active states for each individual link. .current-menu-item captures the active link, but doesn't offer customization for each individual link. I think you can use a combination of nth-child and .current-menu-item. Do you know where .current-menu-item gets applied? If it's on the <li>, this should...
Data Points for Path to draw a tick mark
If you need an specific path I recommend to use Inkscape or Expression Design and try to make by yourself I have made in this case and from copying from Inkscape to Expression Design I have: <Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" x:Name="Layer_1" Width="8" Height="9" Canvas.Left="0" Canvas.Top="0"> <Path Width="7.85446" Height="8.57578" Canvas.Left="-0.0522281" Canvas.Top="-0.100391" Stretch="Fill"...
How to write CSS to convert div elements into a 3 or 4 column table?
css,twitter-bootstrap,webforms,styling
you can use the code the for you desired result <form> <fieldset> <legend>Legend</legend> <div class="container"> <div> <label for="first-name">First Name</label> <input id="first-name" type="text"> </div> <div> <label for="last-name">Last Name</label> <input id="last-name" type="text"> </div> <div> <label for="email">E-Mail</label> <input id="email" type="email" required> </div> <div> <label...
How to underline TextView next to Spinner (continue Spinner background for TextView)
android,android-layout,textview,spinner,styling
//example main public class MyActivity extends Activity { private Spinner spinner; private TextView text; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); spinner = (Spinner) findViewById(R.id.spinner); text = (TextView) findViewById(R.id.text); List<String> list = new ArrayList<String>(); list.add("A"); list.add("B"); list.add("C"); ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, R.layout.custom_spinner_item, list);...
What kind of font is used in this logo_
I would suggest you google for Font determiner. It gives you results where you can upload the picture to find the font (or closest to) like on this page: https://www.myfonts.com/WhatTheFont/...
How to style td with input button and text-size button?
Instead of <input type="submit">, try using a <button> element. You'll find that it's easier to apply CSS styles to. If you apply boz-sizing: border-box CSS rules to the form elements, then you can simply give them a width of 100% and they will fill the available space perfectly: td.wide {...
How do you style an android app?
android,css,styling,look-and-feel
Android has own styles system thought properties. It's a little similar with css. <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:textColor="#00FF00" android:typeface="monospace" android:text="@string/hello" /> You can read more in official documentation ...
Change Z-Index of a label control in code [duplicate]
turns out there's a BringToFront(); I was looking for bringToFront();...
Removing the 'selection' from a radio button in a listview control
c#,wpf,radio-button,styling,listviewitem
Ok, I have no idea what I've done, but I found the answer my tweaking the XAML in this blog post: I've ended up with this Style, I have no idea what it does, but it does what I want it to do. The full XAML for my ListView now...
Replace ControlTemplate with minimum code reproduction
wpf,combobox,styling,controltemplate
If you are asking whether you can reference the original inner controls from the default ComboBox ControlTemplate in XAML, then unfortunately the answer is No, you can't... think about them being the private members of a class. If you don't mind using code, then you can use the FindName method...
How to explore styling in android
I find that styling is about sherlocking your way through the framework. The what (almost always) comes from the widget's implementation. The where, I find is all over the place. I will try my best to explain the process through your particular use-case - AlertDialog's button(s). Starting off: You already...
Setting RenderTransform in a nested style
I found a solution, although it's not perfect. A better answer would still be accepted. I used Snoopto determine that the element I'm concerned with is already a ContentPresenter. It contains a TextBlock, but for some reason that can't be styled (and it's shown in parentheses in Snoop's hierarchy). Here's...
ReCaptcha API v2 Styling
javascript,css,captcha,recaptcha,styling
Overview: Sorry to be the answerer of bad news, but after research and debugging, it's pretty clear that there is no way to customize the styling of the new reCAPTCHA controls. The controls are wrapped in an iframe, which prevents the use of CSS to style them, and Same-Origin Policy...
How to style text similar to a business card?
jsBin demo Here's a new sample of the needed HTML markup inside your LI element: <p> <img src="//placehold.it/100x100&text=LOGO" width="100" height="100"/> AAA<br/> 93939393<br/> 10 sample road, city </p> <p> We are the best, contact us for more information. We are always here to help.</br> Link1 </p> CSS: *{ margin:0; padding:0; }...
Android set style attribute to dynamically created ImageView
Yes offcourse you can set, imageView.setBackgroundResource(R.drawable.style); Where R.drawable.style is you predefined style xml file in your resources....
Styling woocommerce description
html,css,wordpress,woocommerce,styling
Without more references/fiddles provided you shouldn't expect this to work site-wide, but I think adding the following to your stylesheet should solve the issue: body.single-product div.panel.entry-content p { color: #000 } ...
WPF ListView.ItemContainerStyle Presses All ListViewItem Elements Together
In your ListView definition, set the HorizontalContentAlignment property to Stretch. <ListView Name="Worklist" Margin="5 2 5 5" BorderBrush="Transparent" Width="275" HorizontalAlignment="Left" HorizontalContentAlignment="Stretch" Background="{StaticResource AppBackground}" SelectedIndex="{Binding WorklistIndex}"> ... </ListView> ...
Is there any way to increment a CSS value depending on nth-child variable?
The simple answer, given the limitations you've provided (no SASS or other creepy stuff), is no, it's not possible with CSS.