border

Is there an easy way to add a border to the top and bottom of an Android View?

by

In android 2.2 you could do the following. Create an xml drawable such as /res/drawable/textlines.xml and assign this as a TextView’s background property. <TextView android:text=”My text with lines above and below” android:background=”@drawable/textlines” /> /res/drawable/textlines.xml <?xml version=”1.0″ encoding=”utf-8″?> <layer-list xmlns:android=”http://schemas.android.com/apk/res/android” > <item> <shape android:shape=”rectangle”> <stroke android:width=”1dp” android:color=”#FF000000″ /> <solid android:color=”#FFDDDDDD” /> </shape> </item> <item android:top=”1dp” android:bottom=”1dp”> … Read more

Should I use ‘border: none’ or ‘border: 0’?

by

Both are valid. It’s your choice. I prefer border:0 because it’s shorter; I find that easier to read. You may find none more legible. We live in a world of very capable CSS post-processors so I’d recommend you use whatever you prefer and then run it through a “compressor”. There’s no holy war worth fighting … Read more

Placing border inside of div and not on its edge

by

Set box-sizing property to border-box: div { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; width: 100px; height: 100px; border: 20px solid #f00; background: #00f; margin: 10px; } div + div { border: 10px solid red; } <div>Hello!</div> <div>Hello!</div> It works on IE8 & above.

How to put a border around an Android TextView?

by

You can set a shape drawable (a rectangle) as background for the view. <TextView android:text=”Some text” android:background=”@drawable/back”/> And rectangle drawable back.xml (put into res/drawable folder): <shape xmlns:android=”http://schemas.android.com/apk/res/android” android:shape=”rectangle” > <solid android:color=”@android:color/white” /> <stroke android:width=”1dip” android:color=”#4fa5d5″/> </shape> You can use @android:color/transparent for the solid color to have a transparent background. You can also use padding to … Read more

How to remove focus border (outline) around text/input boxes? (Chrome) [duplicate]

by

This border is used to show that the element is focused (i.e. you can type in the input or press the button with Enter). You can remove it with outline property, though: textarea:focus, input:focus{ outline: none; } You may want to add some other way for users to know what element has keyboard focus though … Read more