Нужно перезаписать тему CSS

Question

Я работаю над этой проблемой в течение нескольких дней, и я просто не могу найти ответ.

Я использую Drupal 7, и я пытаюсь использовать корзину покупок E-junkie в одном из моих блоков на главной странице. Всплывающие оверлей и т. Д. Хороши, но, судя по всему, стили CSS в стиле Drupal перезаписывают мои покупки, поэтому это происходит неправильно.

Это сайт, на котором я работаю: http://eastwestcards.com - Под кнопкой «Большая корзина» есть кнопка «Добавить в корзину», которую вы можете использовать, чтобы добавить бесплатный продукт, чтобы быть в состоянии видеть, что я имею в виду корзина с магазинами выходит не так. Моя кнопка выгрузки полностью левее, и если вы нажмете пустое место внизу, оно фактически отправит вас на проверку, списки элементов и остальные таблицы не имеют границ или интервалов между ячейками/отступов и нескольких других вещей.

Теперь этот сайт, с другой стороны, понравится моей корзине покупок: http://pixilate.com/fonts/gardenia-px - Просто нажмите «Добавить в корзину» для продукта, и вы увидите разницу между моей тележкой и сайтами ».

Я искал помощь по всему, и я попробовал все, что мне было предложено, я попытался исключить дизайн тележки из моей таблицы стилей CSS, я попробовал переписать CSS Drupal и т. Д. даже попытался использовать плагин View Source Chart для Firefox, чтобы попытаться определить, какие теги и т. д. Я должен попытаться исправить, чтобы изменить внешний вид корзины покупок на сайте. Я использовал плагин View Source Chart, потому что просмотр исходного файла моей страницы обычно не показывает HTML-код для корзины покупок, потому что это код javascript, предоставляемый e-junkie, который я просто накладываю на свой сайт. Я довольно новичок во всем этом, но я действительно постарался исправить эту проблему, и я надеюсь, что кто-то будет достаточно любезен, чтобы помочь мне! Заранее спасибо!

---

Я сделал это изменение «граница коллапс: отдельный» и «граница разнос: 2px» и я также добавил этот материал в конце моих таблицы стилей CSS, некоторые из них работает, некоторые из них Безразлично» т, но это, кажется, выглядеть хорошо сейчас:

#EJEJC_window table { 
    background-color: white; 
     !important; 
} 

div#EJEJC_iframeContent td 

#EJEJC_iframeContent div { 
    border-width: 3px; 
    border-spacing: 20px; 
    border-style: solid; 
    border-color: green; 
    border-collapse: collapse; 
    background-color: white; 
     !important; 
} 

#EJEJC_iframeContent th { 
    border-width: 3px; 
    border-spacing: 20px; 
    border-style: solid; 
    border-color: green; 
    border-collapse: collapse; 
    background-color: white; 
     !important; 
} 

#ejejctable table { 
font-family: arial; 
font-size: 12pt; 
background-color: white; 
border-style: solid; 
border-color: white; 
padding: 4 px; 
!important; 
} 

#ejejctable th { 
border-width: 4px; 
border-style: solid; 
border-color: white; 
padding: 4px; 
!important; 
} 

#ejejctable td { 
border-width: 4px; 
border-style: solid; 
border-color: white; 
padding: 4px; 
!important; 
} 

#ejejctable tr { 
border-width: 4px; 
border-style: solid; 
border-color: white; 
padding: 4px; 
!important; 
} 

#ejejctable tbody { 
border-width: 4px; 
border-style: solid; 
border-color: white; 
padding: 4px; 
!important; 
} 



#tdHeader { padding: 25px; !important; } 

td#tdPmntOptions tr { float:right; !imporant; } 

#tdPmntOptions tr { float:right; !imporant; } 

img#btnEJ { float:right; !imporant; } 

#btnEJ { float:right; !imporant; } 

Answer 1

Если вы посмотрите на эту screenshot, вы увидите, что проблема есть. Синяя область - ваш тег ссылки, а кнопка проверки - это просто изображение, которое грохочет во всем этом пустом пространстве. Щелчок по белой области приведет вас к проверке, потому что, насколько это касается компьютера, вы фактически нажимаете на тег ссылки (просто не на изображении, которое пользователь ожидал бы щелкнуть).

Быстрое и простое решение состоит в том, чтобы просто дать ссылку тега «float: right». Помимо элементов позиционирования, свойство float также делает контейнеры «термоусадочной пленкой» вокруг их содержимого. В этом случае ваш тег ссылки уменьшится до размера изображения кнопки. Вы также можете дать тегу ссылки фиксированную ширину и высоту, но решение с плавающей точкой более гибкое.

Надеюсь, что это поможет!

EDIT: Просто заметили, что element.style.css устанавливает теги для отображения: block. Там твоя проблема. Измените это на «display: inline», и он должен вести себя нормально.

Что касается интервала между строками на столе, style.css устанавливает крах-коллапс, чтобы свернуть и установить границу с интервалом до 0. Изменение этих параметров на «border-collapse: separate» и «border-spacing: 2px» должно почини это.