html - How to make image scale without media css -


i have image name plate (past champions) plague , looks decent on screens except iphone portrait, seems cut off.

anyway make scale without media css?

here home page. http://www51.myfantasyleague.com/2017/home/61106#0

original code still in css

#championship_plaque h2 {     background:         rgba(0, 0, 0, 0)           url( "http://dagrafixdesigns.com/images/2008/da_2017/da_pro16/plaquetitle_glass.png" )         no-repeat         scroll         center center         !important;     border: 0 none;     margin-left: 25px;     text-indent: -9999px; }

tried code no luck

#championship_plaque h2 {     background:         rgba(0, 0, 0, 0)          url( "http://dagrafixdesigns.com/images/2008/da_2017/da_pro16/plaquetitle_glass.png" )         no-repeat         scroll         center center         !important;     background-position: 70% 0;     background-repeat: no-repeat;     background-size: cover;     padding-bottom: 20px;     padding-top: 20px; }

desktop:

enter image description here

mobile:

enter image description here

i guess can use media call switch new image size screen if else fails, want see if can done way first. thx

in second example you're duplicating property values using shorthand background property !important overriding them afterwards. recommend using longhand properties when want clear what's going on.

what want background-size: contain - automatically downscales image it's 100% visible in parent container. want remove background-color: black:

this rule i've got works me:

#championship_plaque h2 {     background-image: url("http://dagrafixdesigns.com/images/2008/da_2017/da_pro16/plaquetitle_glass.png");     background-size: contain;        background-repeat: no-repeat;     background-position: center center; }

note if want hide text there's better approach text-indent: -9999px, instead consider using combination:

user-select: none; color: #00000000; /* hex rrggbbaa, aa=00 means 0% opacity, text invisible */

Comments

Post a Comment

Popular posts from this blog

c# - Update a combobox from a presenter (MVP) -

i using mvp in project, new in mvp. have 2 comboboxes. when select option in combobox, combobox should filled new data. this action in presenter. view 'view1' in presenter, , introduced combobox1 , combobox2 properties in 'view1', because need 'datasource', 'displaymember', 'valuemember' , 'refresh()' in method below. but, when using pattern, enough send property like public string combobox2 { { return combobox1.selectedvalue.tosstring(); } } into presenter not whole combobox. how can solve problem? public void onselectedindexchangedcombobox1() { if (view1.combobox1.selectedindex == -1) { return; } datatable dt = tools.getdatatable("a path"); var query = (from o in dt.asenumerable() o.field<string>("afield") == farmerview.combobox1.selectedvalue.tostring() orderby o.field<string>("anotherfield") select...
Read more

How to understand 2 main() functions after using uftrace to profile the C++ program? -

i trying uftrace profile following simple c++ program: #include <iostream> class { public: a() {std::cout << "a created" << std::endl;} ~a() {std::cout << "a destroyed" << std::endl;} }; int main() { a; return 0; } the profile result this: # uftrace a.out created destroyed # duration tid function 2.026 [ 4828] | __cxa_atexit(); [ 4828] | main() { [ 4828] | __static_initialization_and_destruction_0() { 89.397 [ 4828] | std::ios_base::init::init(); 0.768 [ 4828] | __cxa_atexit(); 93.029 [ 4828] | } /* __static_initialization_and_destruction_0 */ 94.425 [ 4828] | } /* main */ [ 4828] | main() { [ 4828] | a::a() { 11.104 [ 4828] | std::operator <<(); 10.825 [ 4828] | std::basic_ostream::operator <<(); 24.514 [ 4828] | } /* a::a */ [ 4828] | a::~a() { 0.978 [ 4828] | ...
Read more

How to put a lock and transaction on table using spring 4 or above using jdbcTemplate and annotations like @Transactional? -

i trying put lock on table while writing on table , if happened in between roll-back . trying convert below code lock table test_g1 read; lock table test_g write; -- begin; start transaction; insert test_g1 values(143); insert test_g values(145); select * test_g1; select * test_g; rollback; select * test_g; unlock tables; how convert above code @transactional spring jdbctemplate code? @transactional(rollbackfor={dataaccessexception.class}) public void test(){ jdbctemplate.execute("insert test1 (id, nam) values (4, 'a')"); throw new dataaccessexception("error") { }; } here trying throw error, insert statement should rollback it's not happening . thanks edit-1 attaching code , doing in jdbcdaoimpl.java , mentioned problem comment above test() . app.java package com.cgiri.javabrains.spring4; import org.springframework.beans.factory.annotation.autowired; import org.springframework.context.applic...
Read more